.dnd-section,.dnd-column{padding:0!important}.dnd-section>.row-fluid,.row-fluid{max-width:none!important}.body-container-wrapper{background:#0f172a}footer[aria-label="Amazing.com footer"]{display:none!important}html{scroll-behavior:smooth;scroll-padding-top:84px}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Amazing Membership join page. Everything is scoped under .amzj so the
   HubSpot theme cannot leak in and this cannot leak out. Tokens follow the
   Amazing brand system and the evergreen homepage (Inter, navy, orange). */

.amzj {
  --bg: #0f172a;
  --bg-2: #1e293b;
  --line: rgba(148, 163, 184, 0.22);
  --brand: #f97316;
  --brand-dark: #ea580c;
  --brand-on-light: #c2410c;
  --gold: #f59e0b;
  --success: #22c55e;
  --heading: #ffffff;
  --text: #f3f4f6;
  --muted: #94a3b8;
  --ink: #0f172a;
  --ink-2: #334155;
  --ink-muted: #475569;
  --paper: #f8fafc;
  --card: #ffffff;
  --card-line: #e2e8f0;
  --radius: 16px;
  --radius-lg: 24px;
  --wrap: 1120px;

  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

.amzj *,
.amzj *::before,
.amzj *::after { box-sizing: border-box; }

/* :where() keeps the reset at single-class specificity so component rules win. */
.amzj :where(h1, h2, h3, p, ul, ol, li, figure, blockquote) { margin: 0; padding: 0; font-family: inherit; }
.amzj :where(ul, ol) { list-style: none; }
.amzj :where(img) { display: block; max-width: 100%; height: auto; }
.amzj :where(a) { color: inherit; }
.amzj h1, .amzj h2 { text-wrap: balance; letter-spacing: -0.03em; }
.amzj p, .amzj li, .amzj blockquote { text-wrap: pretty; }
.amzj a:focus-visible, .amzj summary:focus-visible {
  outline: 3px solid var(--brand);
  outline-offset: 4px;
  border-radius: 8px;
}

.amzj-wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
.amzj-narrow { max-width: 860px; }

.amzj-eyebrow {
  color: var(--brand);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.amzj-light .amzj-eyebrow { color: var(--brand-on-light); }

.amzj-h2 {
  color: var(--heading);
  font-size: clamp(28px, 3.4vw, 42px);
  font-weight: 800;
  line-height: 1.12;
}
.amzj-light .amzj-h2 { color: var(--ink); }
.amzj-lead { color: var(--muted); font-size: 18px; max-width: 720px; }
.amzj-light .amzj-lead { color: var(--ink-muted); }
.amzj-head { display: grid; gap: 14px; justify-items: center; text-align: center; margin-bottom: 44px; }

.amzj-section { padding: 88px 0; }
.amzj-light { background: var(--paper); color: var(--ink-2); }
.amzj-white { background: #ffffff; }

/* ---------- Header ---------- */
.amzj-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 0; }
.amzj-header img { width: 140px; height: 32px; object-fit: contain; object-position: left center; }
.amzj-header-meta { display: flex; align-items: center; gap: 22px; color: var(--muted); font-size: 14px; }
.amzj-header-meta span { display: inline-flex; align-items: center; gap: 8px; }
.amzj-header-meta a { color: var(--text) !important; text-decoration: none !important; }
.amzj-header-meta a:hover { color: var(--brand) !important; }
.amzj-icon { width: 18px; height: 18px; flex: none; }

/* ---------- Hero ---------- */
.amzj-hero {
  position: relative;
  overflow: hidden;
  padding-bottom: 72px;
  background:
    radial-gradient(900px 420px at 72% 46%, rgba(249, 115, 22, 0.16), transparent 70%),
    radial-gradient(700px 380px at 12% 0%, rgba(59, 130, 246, 0.10), transparent 70%),
    var(--bg);
}
.amzj-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(148, 163, 184, 0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(148, 163, 184, 0.06) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse at 50% 30%, #000 20%, transparent 72%);
  -webkit-mask-image: radial-gradient(ellipse at 50% 30%, #000 20%, transparent 72%);
  pointer-events: none;
}
.amzj-hero > * { position: relative; }
.amzj-hero-copy { display: grid; gap: 18px; justify-items: center; text-align: center; padding: 18px 0 38px; }
.amzj-h1 {
  max-width: 1000px;
  color: var(--heading);
  font-size: clamp(33px, 4.5vw, 58px);
  font-weight: 900;
  line-height: 1.05;
}
.amzj-h1 em { color: var(--brand); font-style: normal; }
.amzj-hero-copy .amzj-lead { color: #cbd5e1; max-width: 760px; }

/* ---------- Plans ---------- */
.amzj-plans { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr); gap: 22px; max-width: 940px; margin: 0 auto; align-items: stretch; }
.amzj-plan {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 30px 30px 26px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(30, 41, 59, 0.72);
  backdrop-filter: blur(8px);
}
.amzj-plan--best {
  border: 2px solid var(--brand);
  background: linear-gradient(180deg, rgba(249, 115, 22, 0.13), rgba(30, 41, 59, 0.86) 42%);
  box-shadow: 0 24px 70px rgba(249, 115, 22, 0.20);
}
.amzj-plan-flag {
  position: absolute;
  top: -14px;
  left: 28px;
  padding: 5px 14px;
  border-radius: 999px;
  background: var(--brand);
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.amzj-plan-name { color: var(--heading); font-size: 20px; font-weight: 700; line-height: 1.3; }
.amzj-plan-kicker { color: var(--muted); font-size: 12px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 6px; }
.amzj-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px; margin: 12px 0 4px; color: var(--heading); }
.amzj-price strong { font-size: clamp(46px, 5vw, 60px); font-weight: 900; line-height: 1; letter-spacing: -0.04em; }
.amzj-price span { color: #cbd5e1; font-size: 17px; font-weight: 600; }
.amzj-billed { color: #cbd5e1; font-size: 15px; }
.amzj-billed s { color: var(--muted); }
.amzj-billed b { color: var(--heading); }
.amzj-plan ul { display: grid; gap: 10px; margin: 20px 0 24px; }
.amzj-plan li { position: relative; padding-left: 28px; color: var(--text); font-size: 15px; line-height: 1.5; }
.amzj-plan li svg { position: absolute; left: 0; top: 2px; width: 18px; height: 18px; color: var(--brand); }
.amzj-plan li b { color: var(--heading); }
.amzj-plan-foot { margin-top: 12px; color: var(--muted); font-size: 13px; text-align: center; }

.amzj .amzj-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  min-height: 58px;
  margin-top: auto;
  padding: 16px 24px;
  border: 2px solid var(--brand);
  border-radius: 999px;
  background: var(--brand) !important;
  color: var(--ink) !important;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.25;
  text-align: center;
  text-decoration: none !important;
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
.amzj .amzj-btn:hover { background: #fb8a3c !important; border-color: #fb8a3c; box-shadow: 0 10px 30px rgba(249, 115, 22, 0.35); }
.amzj .amzj-btn--ghost { background: transparent !important; color: var(--heading) !important; border-color: rgba(248, 250, 252, 0.55); }
.amzj .amzj-btn--ghost:hover { background: rgba(248, 250, 252, 0.08) !important; border-color: #ffffff; box-shadow: none; }
.amzj-btn svg { width: 18px; height: 18px; flex: none; }

.amzj-trust { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 30px; margin-top: 30px; color: #cbd5e1; font-size: 14px; }
.amzj-trust span { display: inline-flex; align-items: center; gap: 8px; }
.amzj-trust svg { color: var(--success); }

.amzj-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; max-width: 760px; margin: 44px auto 0; }
.amzj-stat { padding: 20px 22px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(15, 23, 42, 0.55); text-align: center; }
.amzj-stat strong { display: block; color: var(--heading); font-size: clamp(26px, 3.2vw, 36px); font-weight: 800; letter-spacing: -0.03em; line-height: 1.15; }
.amzj-stat span { color: var(--muted); font-size: 14px; }

/* ---------- Quotes ---------- */
.amzj-quote-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.amzj-quote {
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding: 28px;
  border: 1px solid var(--card-line);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 12px 32px rgba(15, 23, 42, 0.06);
}
.amzj-quote blockquote { color: var(--ink); font-size: 18px; font-weight: 500; line-height: 1.55; }
.amzj-quote blockquote::before {
  content: "\201C";
  display: block;
  height: 30px;
  color: var(--brand);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 60px;
  line-height: 1;
}
.amzj-quote--hl blockquote { font-size: 23px; font-weight: 700; line-height: 1.35; letter-spacing: -0.015em; }
.amzj-by { display: flex; align-items: center; gap: 14px; margin-top: auto; }
.amzj-by img, .amzj-avatar { width: 56px; height: 56px; flex: none; border-radius: 50%; object-fit: cover; }
.amzj-avatar { display: grid; place-items: center; background: var(--bg-2); color: #ffffff; font-size: 17px; font-weight: 800; letter-spacing: 0.02em; }
.amzj-by strong { display: block; color: var(--ink); font-size: 16px; line-height: 1.3; }
.amzj-by div span { display: block; color: var(--ink-muted); font-size: 13px; line-height: 1.4; }
.amzj-chip {
  align-self: flex-start;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(249, 115, 22, 0.12);
  color: var(--brand-on-light);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}
.amzj-context { color: var(--ink-muted); font-size: 15px; }

/* ---------- Value stack ---------- */
.amzj-stack { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.amzj-panel { display: grid; gap: 22px; padding: 32px; border: 1px solid var(--card-line); border-top: 4px solid var(--brand); border-radius: var(--radius); background: var(--card); box-shadow: 0 12px 32px rgba(15, 23, 42, 0.06); }
.amzj-panel-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.amzj-panel h3 { color: var(--ink); font-size: 25px; font-weight: 800; line-height: 1.2; letter-spacing: -0.02em; }
.amzj-panel-sub { color: var(--ink-muted); font-size: 16px; }
.amzj-value-tag { flex: none; padding: 6px 12px; border-radius: 999px; background: var(--ink); color: #ffffff; font-size: 13px; font-weight: 800; white-space: nowrap; }
.amzj-shot { border: 1px solid var(--card-line); border-radius: 12px; background: var(--paper); padding: 14px; }
.amzj-shot img { width: 100%; border-radius: 6px; }
.amzj-systems { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 20px; counter-reset: sys; }
.amzj-systems li { position: relative; padding-left: 34px; color: var(--ink-2); font-size: 15px; line-height: 1.4; counter-increment: sys; }
.amzj-systems li::before {
  content: counter(sys, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 1px;
  color: var(--brand-on-light);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
}
.amzj-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.amzj-chips li { padding: 6px 12px; border: 1px solid var(--card-line); border-radius: 999px; background: var(--paper); color: var(--ink); font-size: 14px; font-weight: 600; }
.amzj-label { color: var(--ink); font-size: 13px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.amzj-roles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.amzj-roles li { padding: 14px 16px; border: 1px solid var(--card-line); border-radius: 12px; background: var(--paper); }
.amzj-roles strong { display: block; color: var(--ink); font-size: 15px; line-height: 1.3; }
.amzj-roles span { display: block; margin-top: 3px; color: var(--ink-muted); font-size: 14px; line-height: 1.45; }
.amzj-roles em { display: block; margin-top: 6px; color: var(--brand-on-light); font-size: 12px; font-style: normal; font-weight: 700; line-height: 1.4; }
.amzj-mini { display: grid; gap: 14px; }
.amzj-mini figure { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: start; }
.amzj-mini img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.amzj-mini blockquote { color: var(--ink); font-size: 15px; line-height: 1.5; }
.amzj-mini figcaption { margin-top: 4px; color: var(--ink-muted); font-size: 13px; }

.amzj-ledger { max-width: 860px; margin: 40px auto 0; padding: 30px 34px; border-radius: var(--radius); background: var(--bg); color: var(--text); box-shadow: 0 24px 60px rgba(15, 23, 42, 0.25); }
.amzj-ledger li { display: flex; align-items: baseline; gap: 12px; padding: 12px 0; border-bottom: 1px dashed rgba(148, 163, 184, 0.35); font-size: 16px; }
.amzj-ledger li span:first-child { color: var(--text); }
.amzj-ledger li i { flex: 1; }
.amzj-ledger li b { color: var(--heading); white-space: nowrap; }
.amzj-ledger-total { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; padding-top: 22px; }
.amzj-ledger-total p { color: var(--muted); font-size: 15px; }
.amzj-ledger-total strong { display: block; color: var(--heading); font-size: 26px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; }
.amzj-ledger-total strong em { color: var(--brand); font-style: normal; }
.amzj-ledger .amzj-btn { width: auto; min-width: 250px; margin-top: 0; }

.amzj-more > summary { display: none; list-style: none; }
.amzj-more > summary::-webkit-details-marker { display: none; }

/* ---------- Two ways (dark editorial) ---------- */
.amzj-ways { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 28px; align-items: stretch; }
.amzj-feature { display: flex; flex-direction: column; gap: 26px; padding: 40px; border: 1px solid var(--line); border-left: 4px solid var(--brand); border-radius: var(--radius); background: var(--bg-2); }
.amzj-feature blockquote { color: var(--heading); font-size: clamp(19px, 1.9vw, 23px); font-weight: 500; line-height: 1.55; }
.amzj-feature blockquote b { color: var(--brand); font-weight: 700; }
.amzj-dark .amzj-by strong { color: var(--heading); }
.amzj-dark .amzj-by div span { color: var(--muted); }
.amzj-dark .amzj-chip { background: rgba(249, 115, 22, 0.16); color: #fdba74; }
.amzj-feature .amzj-chip { padding: 12px 16px; border-radius: 12px; font-weight: 600; line-height: 1.5; }
.amzj-side { display: grid; gap: 22px; }
.amzj-side .amzj-quote { border-color: var(--line); background: rgba(30, 41, 59, 0.6); box-shadow: none; }
.amzj-side .amzj-quote blockquote { color: var(--text); font-size: 16px; font-weight: 400; }
.amzj-dark .amzj-avatar { background: #334155; }

/* ---------- Results ---------- */
.amzj-results { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 22px; }
.amzj-results > :nth-child(1) { grid-column: span 6; }
.amzj-results > :nth-child(n + 2) { grid-column: span 2; }
.amzj-result-feature { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 34px; align-items: center; }
.amzj-result-feature > img { width: 220px; height: 220px; border-radius: var(--radius); object-fit: cover; }
.amzj-result-feature .amzj-body { display: grid; gap: 16px; }
.amzj-disclaimer { max-width: 860px; margin: 34px auto 0; color: var(--ink-muted); font-size: 13px; line-height: 1.65; text-align: center; }

/* ---------- Guarantee ---------- */
.amzj-guarantee { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 40px; align-items: center; padding: 44px; border: 1px solid #fed7aa; border-radius: var(--radius-lg); background: linear-gradient(135deg, #fff7ed, #ffffff 60%); }
.amzj-seal { display: grid; place-items: center; width: 150px; height: 150px; border: 3px solid var(--brand); border-radius: 50%; background: #ffffff; color: var(--brand-on-light); text-align: center; box-shadow: 0 0 0 8px rgba(249, 115, 22, 0.12); }
.amzj-seal strong { display: block; color: var(--ink); font-size: 46px; font-weight: 900; line-height: 1; letter-spacing: -0.04em; }
.amzj-seal span { display: block; font-size: 11px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.amzj-guarantee h2 { margin-bottom: 12px; }
.amzj-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 24px; counter-reset: step; }
.amzj-steps li { counter-increment: step; padding-top: 14px; border-top: 2px solid #fdba74; color: var(--ink-2); font-size: 15px; line-height: 1.5; }
.amzj-steps li::before { content: "0" counter(step); display: block; margin-bottom: 4px; color: var(--brand-on-light); font-size: 12px; font-weight: 800; letter-spacing: 0.1em; }
.amzj-steps b { color: var(--ink); }

/* ---------- On the fence ---------- */
.amzj-fence { display: grid; gap: 28px; justify-items: center; text-align: center; }
.amzj-fence-q { max-width: 760px; color: var(--muted); font-size: 18px; font-style: italic; }
.amzj-fence blockquote { max-width: 900px; color: var(--heading); font-size: clamp(21px, 2.5vw, 30px); font-weight: 600; line-height: 1.42; letter-spacing: -0.015em; }
.amzj-fence blockquote b { color: var(--brand); font-weight: 700; }
.amzj-fence .amzj-by { margin-top: 0; text-align: left; }
.amzj-fence .amzj-by img { width: 64px; height: 64px; }

/* ---------- FAQ ---------- */
.amzj-faq { display: grid; gap: 12px; }
.amzj-faq details { border: 1px solid var(--card-line); border-radius: 14px; background: var(--card); }
.amzj-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 24px; color: var(--ink); font-size: 17px; font-weight: 700; line-height: 1.4; cursor: pointer; list-style: none; }
.amzj-faq summary::-webkit-details-marker { display: none; }
.amzj-faq summary::after { content: "+"; flex: none; color: var(--brand-on-light); font-size: 26px; font-weight: 500; line-height: 1; transition: transform 200ms ease; }
.amzj-faq details[open] summary::after { transform: rotate(45deg); }
.amzj-faq details > div { display: grid; gap: 12px; padding: 0 24px 22px; color: var(--ink-2); font-size: 16px; }
.amzj-faq a { color: var(--brand-on-light) !important; font-weight: 600; }

/* ---------- Final ---------- */
.amzj-final { text-align: center; background: radial-gradient(800px 380px at 50% 100%, rgba(249, 115, 22, 0.18), transparent 70%), var(--bg); }
.amzj-final-plans { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; max-width: 760px; margin: 36px auto 0; }
.amzj-final-plan { display: grid; gap: 14px; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(30, 41, 59, 0.7); }
.amzj-final-plan--best { border: 2px solid var(--brand); }
.amzj-final-plan p { color: #cbd5e1; font-size: 15px; }
.amzj-final-plan p b { color: var(--heading); font-size: 19px; }
.amzj-legal { max-width: 860px; margin: 36px auto 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.amzj-legal a { color: #cbd5e1 !important; }
.amzj-legal b { color: #cbd5e1; }
.amzj-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; padding: 26px 0 96px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }
.amzj-footer nav { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.amzj-footer a { color: var(--muted) !important; text-decoration: none !important; }
.amzj-footer a:hover { color: var(--text) !important; }

/* ---------- Sticky mobile bar ---------- */
.amzj-sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; display: none; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: rgba(15, 23, 42, 0.96); backdrop-filter: blur(10px); transform: translateY(110%); transition: transform 220ms ease; }
.amzj-sticky.is-on { transform: translateY(0); }
.amzj-sticky p { color: var(--muted); font-size: 12px; line-height: 1.35; }
.amzj-sticky p b { display: block; color: var(--heading); font-size: 15px; }
.amzj .amzj-sticky .amzj-btn { width: auto; min-height: 48px; margin: 0; padding: 12px 20px; font-size: 15px; }

/* ---------- Load-in ---------- */
@media (prefers-reduced-motion: no-preference) {
  /* Kept short on purpose: the plan buttons must never wait on decoration. */
  .amzj-rise { opacity: 0; transform: translateY(10px); animation: amzj-rise 380ms cubic-bezier(0.2, 0.7, 0.2, 1) forwards; }
  .amzj-rise:nth-child(2) { animation-delay: 50ms; }
  .amzj-rise:nth-child(3) { animation-delay: 100ms; }
  .amzj-plans .amzj-rise:nth-child(1) { animation-delay: 120ms; }
  .amzj-plans .amzj-rise:nth-child(2) { animation-delay: 170ms; }
  @keyframes amzj-rise { to { opacity: 1; transform: none; } }
}

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .amzj-quote-grid { grid-template-columns: minmax(0, 1fr); }
  .amzj-stack, .amzj-ways { grid-template-columns: minmax(0, 1fr); }
  .amzj-results > :nth-child(n + 2) { grid-column: span 6; }
}

@media (max-width: 767px) {
  .amzj-wrap { padding: 0 18px; }
  .amzj-section { padding: 60px 0; }
  .amzj-head { margin-bottom: 32px; }
  .amzj-header { padding: 16px 0; }
  .amzj-header img { width: 118px; height: 28px; }
  .amzj-header-meta span { display: none; }
  .amzj-hero { padding-bottom: 52px; }
  .amzj-hero-copy { gap: 12px; padding: 2px 0 30px; }
  .amzj-hero-copy .amzj-lead { font-size: 16px; line-height: 1.5; }
  .amzj .amzj-btn { min-height: 54px; padding: 14px 16px; font-size: 16px; gap: 8px; }
  .amzj-plan ul { gap: 8px; margin: 16px 0 20px; }
  .amzj-plans { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .amzj-plan { padding: 28px 22px 22px; }
  .amzj-stats { grid-template-columns: minmax(0, 1fr); gap: 12px; margin-top: 34px; }
  .amzj-panel { padding: 24px 20px; }
  .amzj-panel-top { flex-direction: column; }
  .amzj-more > summary { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border: 1px solid var(--card-line); border-radius: 12px; background: var(--paper); color: var(--ink); font-size: 15px; font-weight: 700; cursor: pointer; }
  .amzj-more > summary::after { content: '+'; color: var(--brand-on-light); font-size: 22px; line-height: 1; }
  .amzj-more[open] > summary { margin-bottom: 16px; }
  .amzj-more[open] > summary::after { content: '3'; }
  .amzj-systems, .amzj-roles { grid-template-columns: minmax(0, 1fr); }
  .amzj-ledger { padding: 24px 20px; }
  .amzj-ledger li { flex-direction: column; gap: 2px; }
  .amzj-ledger li i { display: none; }
  .amzj-ledger .amzj-btn { width: 100%; }
  .amzj-feature { padding: 28px 22px; }
  .amzj-result-feature { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .amzj-result-feature > img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-position: 50% 30%; }
  .amzj-guarantee { grid-template-columns: minmax(0, 1fr); gap: 26px; padding: 30px 22px; justify-items: center; text-align: center; }
  .amzj-steps { grid-template-columns: minmax(0, 1fr); text-align: left; }
  .amzj-faq summary { padding: 18px 18px; font-size: 16px; }
  .amzj-faq details > div { padding: 0 18px 20px; }
  .amzj-final-plans { grid-template-columns: minmax(0, 1fr); }
  .amzj-sticky { display: flex; }
}

/* Homepage additions. Loaded after output/membership-join-page/styles.css so
   both pages share one design system (.amzj tokens, buttons, quotes, panels). */

/* ---------- Sticky header ---------- */
.amzh-top { position: sticky; top: 0; z-index: 50; background: rgba(15, 23, 42, 0.92); backdrop-filter: blur(12px); border-bottom: 1px solid transparent; transition: border-color 200ms ease, box-shadow 200ms ease; }
.amzh-top.is-stuck { border-bottom-color: var(--line); box-shadow: 0 10px 30px rgba(2, 6, 23, 0.45); }
.amzh-top .amzj-wrap { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 72px; }
.amzh-top img { width: 140px; height: 32px; object-fit: contain; object-position: left center; }
.amzh-nav { display: flex; align-items: center; gap: 28px; font-size: 15px; font-weight: 500; }
.amzh-nav a { color: var(--text) !important; text-decoration: none !important; transition: color 160ms ease; }
.amzh-nav a:hover { color: var(--brand) !important; }
.amzh-actions { display: flex; align-items: center; gap: 20px; font-size: 14px; }
.amzh-actions > a:first-child { color: #cbd5e1 !important; text-decoration: none !important; white-space: nowrap; }
.amzh-actions > a:first-child:hover { color: #ffffff !important; }
.amzj .amzh-top .amzj-btn { width: auto; min-height: 44px; margin: 0; padding: 10px 20px; font-size: 15px; white-space: nowrap; }

/* ---------- Hero ---------- */
.amzh-hero { padding: 56px 0 0; }
.amzh-hero-grid { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.82fr); gap: 48px; align-items: center; }
.amzh-hero-copy { display: grid; gap: 20px; justify-items: start; }
.amzh-hero .amzj-h1 { font-size: clamp(35px, 4vw, 54px); text-align: left; }
.amzh-hero .amzj-h1 em { display: block; }
.amzh-hero .amzj-lead { color: #cbd5e1; font-size: 19px; max-width: 600px; }
.amzh-cta-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 6px; }
.amzj .amzh-cta-row .amzj-btn { width: auto; margin: 0; padding: 16px 28px; }
.amzh-micro { display: flex; flex-wrap: wrap; gap: 8px 22px; color: #cbd5e1; font-size: 14px; }
.amzh-micro span { display: inline-flex; align-items: center; gap: 8px; }
.amzh-micro svg { color: var(--success); }
.amzh-visual { position: relative; padding: 0 0 64px 0; }
.amzh-visual-card { padding: 26px; border: 1px solid rgba(248, 250, 252, 0.14); border-radius: var(--radius-lg); background: linear-gradient(160deg, #f8fafc, #e2e8f0); box-shadow: 0 40px 90px rgba(2, 6, 23, 0.55), 0 0 0 1px rgba(249, 115, 22, 0.18); }
.amzh-visual-card img { width: 100%; }
.amzh-float { position: absolute; left: -26px; bottom: 0; display: flex; align-items: center; gap: 14px; max-width: 330px; padding: 14px 18px; border: 1px solid var(--line); border-radius: 16px; background: rgba(15, 23, 42, 0.94); box-shadow: 0 18px 44px rgba(2, 6, 23, 0.55); }
.amzh-float img { width: 48px; height: 48px; flex: none; border-radius: 50%; object-fit: cover; }
.amzh-float blockquote { color: var(--heading); font-size: 15px; font-weight: 600; line-height: 1.35; }
.amzh-float span { display: block; margin-top: 2px; color: var(--muted); font-size: 12px; }

/* ---------- Proof band ---------- */
.amzh-proof { margin-top: 64px; padding: 34px 0 38px; border-top: 1px solid var(--line); background: rgba(2, 6, 23, 0.35); }
.amzh-proof-grid { display: grid; grid-template-columns: auto auto minmax(0, 1fr); gap: 44px; align-items: center; }
.amzh-proof-stat strong { display: block; color: var(--heading); font-size: clamp(26px, 2.8vw, 36px); font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.amzh-proof-stat span, .amzh-proof-stat a { color: var(--muted) !important; font-size: 13px; text-decoration: none !important; }
.amzh-worked { display: grid; gap: 12px; justify-items: end; }
.amzh-worked p { color: var(--muted); font-size: 12px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.amzh-worked ul { display: flex; flex-wrap: nowrap; justify-content: flex-end; gap: 10px; }
.amzh-worked li { display: grid; justify-items: center; align-content: start; gap: 6px; width: 68px; color: #cbd5e1; font-size: 11px; line-height: 1.25; text-align: center; }
.amzh-worked img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; filter: grayscale(0.2); }

/* ---------- Membership ---------- */
.amzh-bullets { display: grid; gap: 14px; }
.amzh-bullets li { padding-left: 16px; border-left: 2px solid #fdba74; }
.amzh-bullets strong { display: block; color: var(--ink); font-size: 16px; line-height: 1.35; }
.amzh-bullets span { display: block; margin-top: 2px; color: var(--ink-muted); font-size: 15px; line-height: 1.5; }
.amzh-apply { max-width: 900px; margin: 36px auto 0; text-align: center; }
.amzh-apply strong { display: block; margin-bottom: 8px; color: var(--ink); font-size: 21px; font-weight: 800; letter-spacing: -0.015em; }
.amzh-apply p { color: var(--ink-muted); font-size: 16px; }
.amzh-offer { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 36px; align-items: center; max-width: 1000px; margin: 40px auto 0; padding: 36px 40px; border-radius: var(--radius-lg); background: var(--bg); color: var(--text); box-shadow: 0 30px 70px rgba(15, 23, 42, 0.28); }
.amzh-offer h3 { color: var(--heading); font-size: 26px; font-weight: 800; line-height: 1.2; letter-spacing: -0.02em; }
.amzh-offer-price { margin: 14px 0 6px; color: var(--heading); font-size: 19px; font-weight: 600; }
.amzh-offer-price b { color: var(--brand); font-size: 30px; font-weight: 900; letter-spacing: -0.03em; }
.amzh-offer-note { color: var(--muted); font-size: 14px; }
.amzj .amzh-offer .amzj-btn { width: auto; margin-top: 22px; padding: 16px 30px; }
.amzh-offer figure { display: grid; gap: 16px; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg-2); }
.amzh-offer .amzj-by strong { color: var(--heading); }
.amzh-offer .amzj-by div span { color: var(--muted); }
.amzh-offer blockquote { color: var(--heading); font-size: 20px; font-weight: 700; line-height: 1.35; letter-spacing: -0.015em; }

/* ---------- Copilot ---------- */
.amzh-marker { display: inline-block; padding: 6px 14px; border: 1px solid rgba(249, 115, 22, 0.5); border-radius: 999px; color: #fdba74; font-size: 12px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.amzh-copilot-intro { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); gap: 48px; align-items: center; margin-top: 56px; padding-top: 56px; border-top: 1px solid var(--line); }
.amzh-copilot-intro h2 em { display: block; color: var(--brand); font-style: normal; }
.amzh-copilot-intro .amzj-lead { margin: 18px 0 26px; color: #cbd5e1; }
.amzh-included { display: inline-block; margin-bottom: 18px; padding: 7px 14px; border-radius: 999px; background: rgba(249, 115, 22, 0.14); color: #fdba74; font-size: 13px; font-weight: 700; }
.amzj .amzh-inline-btn { width: auto; margin: 0; padding: 16px 28px; }
.amzh-coach { position: relative; overflow: hidden; border-radius: var(--radius-lg); background: var(--bg-2); }
.amzh-coach img { width: 100%; height: 420px; object-fit: cover; object-position: 50% 18%; }
.amzh-coach figcaption { position: absolute; inset: auto 0 0 0; padding: 60px 22px 20px; background: linear-gradient(transparent, rgba(15, 23, 42, 0.96)); }
.amzh-coach strong { display: block; color: var(--heading); font-size: 18px; line-height: 1.3; }
.amzh-coach span { color: #cbd5e1; font-size: 14px; }
.amzh-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; align-items: center; margin-top: 72px; }
.amzh-row--flip > :first-child { order: 2; }
.amzh-row h3 { margin: 10px 0 18px; color: var(--heading); font-size: clamp(26px, 2.6vw, 34px); font-weight: 800; line-height: 1.15; letter-spacing: -0.025em; }
.amzh-row h3 span { color: var(--brand); }
.amzh-row p { color: #cbd5e1; }
.amzh-points { display: grid; gap: 18px; }
.amzh-points h4 { margin: 0 0 4px; color: var(--heading); font-family: inherit; font-size: 17px; font-weight: 700; line-height: 1.35; }
.amzh-points p { margin: 0; color: #cbd5e1; font-size: 15px; }
.amzh-shot-dark { overflow: hidden; border: 1px solid #475569; border-radius: var(--radius); background: #0b1424; }
.amzh-shot-dark img { width: 100%; max-height: 460px; object-fit: contain; }
.amzh-tools-head { display: grid; gap: 12px; justify-items: center; max-width: 760px; margin: 84px auto 36px; text-align: center; }
.amzh-tools-head h3 { color: var(--heading); font-size: clamp(26px, 2.6vw, 34px); font-weight: 800; letter-spacing: -0.025em; }
.amzh-tools-head p:last-child { color: #cbd5e1; }
.amzh-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.amzh-tools article { display: grid; gap: 18px; align-content: start; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(30, 41, 59, 0.6); }
.amzh-tools article:last-child { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: 32px; }
.amzh-tools .amzh-kicker { color: var(--brand); font-size: 12px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.amzh-tools h4 { margin: 6px 0 10px; color: var(--heading); font-family: inherit; font-size: 21px; font-weight: 800; line-height: 1.25; letter-spacing: -0.015em; }
.amzh-tools p { color: #cbd5e1; font-size: 15px; }
.amzh-tools p + p { margin-top: 8px; color: var(--muted); }
.amzh-voices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-top: 72px; }
.amzh-voices-head { margin-top: 84px; text-align: center; }
.amzh-voices-head h3 { margin-top: 10px; color: var(--heading); font-size: clamp(24px, 2.4vw, 30px); font-weight: 800; letter-spacing: -0.02em; }
.amzh-voices { margin-top: 30px; }
.amzh-voices .amzj-quote { border-color: var(--line); background: rgba(30, 41, 59, 0.6); box-shadow: none; }
.amzh-voices .amzj-quote blockquote { color: var(--text); font-size: 16px; font-weight: 400; }
.amzh-recap { display: grid; gap: 16px; justify-items: center; max-width: 820px; margin: 84px auto 0; padding: 48px 36px; border: 1px solid rgba(249, 115, 22, 0.45); border-radius: var(--radius-lg); background: radial-gradient(600px 240px at 50% 0%, rgba(249, 115, 22, 0.16), transparent 70%), var(--bg-2); text-align: center; }
.amzh-recap h3 { color: var(--heading); font-size: clamp(28px, 3vw, 38px); font-weight: 800; line-height: 1.12; letter-spacing: -0.03em; }
.amzh-recap p { color: #cbd5e1; }

/* ---------- Note from Mike ---------- */
.amzh-note { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 56px; align-items: start; max-width: 1000px; margin: 0 auto; }
.amzh-note figure { position: relative; overflow: hidden; border-radius: var(--radius-lg); }
.amzh-note figure img { width: 100%; height: 440px; object-fit: cover; object-position: 50% 18%; }
.amzh-note figcaption { position: absolute; inset: auto 0 0 0; padding: 50px 20px 18px; background: linear-gradient(transparent, rgba(15, 23, 42, 0.92)); color: #ffffff; }
.amzh-note figcaption strong { display: block; font-size: 18px; }
.amzh-note figcaption span { color: #e2e8f0; font-size: 14px; }
.amzh-letter { display: grid; gap: 16px; }
.amzh-letter p { color: var(--ink-2); font-size: 17px; line-height: 1.7; }
.amzh-letter .amzh-opening { color: var(--ink); font-size: 21px; font-weight: 600; line-height: 1.5; }
.amzh-letter .amzh-sign strong { display: block; color: var(--ink); }
.amzh-letter .amzh-sign span { color: var(--ink-muted); font-size: 15px; }

/* ---------- Story wall ---------- */
.amzh-wall { columns: 3; column-gap: 22px; }
.amzh-wall .amzj-quote { display: inline-flex; width: 100%; margin: 0 0 22px; break-inside: avoid; }
.amzh-wall .amzj-quote blockquote { font-size: 17px; }
.amzh-kind { align-self: flex-start; padding: 4px 10px; border-radius: 999px; background: var(--paper); border: 1px solid var(--card-line); color: var(--ink-muted); font-size: 11px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.amzh-show-all { display: block; margin: 4px auto 0; padding: 12px 22px; border: 1px solid var(--card-line); border-radius: 999px; background: #ffffff; color: var(--ink); font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
.amzh-show-all[hidden] { display: none; }
.amzh-more-link { display: block; margin-top: 18px; color: var(--brand-on-light) !important; font-size: 17px; font-weight: 700; text-align: center; text-decoration: none !important; }
.amzh-more-link:hover { text-decoration: underline !important; }

/* ---------- Close ---------- */
.amzh-close-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; max-width: 980px; margin: 40px auto 0; text-align: left; }
.amzh-close-card { display: flex; flex-direction: column; gap: 12px; padding: 32px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: rgba(30, 41, 59, 0.7); }
.amzh-close-card--best { border: 2px solid var(--brand); box-shadow: 0 24px 70px rgba(249, 115, 22, 0.18); }
.amzh-close-card h3 { color: var(--heading); font-size: 25px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; }
.amzh-close-card p { color: #cbd5e1; font-size: 16px; }
.amzh-close-card .amzh-close-price { color: var(--heading); font-weight: 700; }
.amzj .amzh-close-card .amzj-btn { margin-top: 14px; }

.amzh-skip { position: absolute; left: 16px; top: -80px; z-index: 100; padding: 14px; background: #ffffff; color: var(--ink) !important; }
.amzh-skip:focus { top: 12px; }

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  .amzh-nav { display: none; }
  .amzh-proof-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
  .amzh-worked { grid-column: 1 / -1; justify-items: start; }
  .amzh-worked ul { justify-content: flex-start; flex-wrap: wrap; }
}

@media (max-width: 960px) {
  .amzh-hero-grid, .amzh-copilot-intro, .amzh-row, .amzh-offer, .amzh-note { grid-template-columns: minmax(0, 1fr); }
  .amzh-row--flip > :first-child { order: 0; }
  .amzh-float { left: 12px; }
  .amzh-tools, .amzh-voices, .amzh-close-grid { grid-template-columns: minmax(0, 1fr); }
  .amzh-tools article:last-child { grid-template-columns: minmax(0, 1fr); }
  .amzh-wall { columns: 2; }
  .amzh-note figure { max-width: 340px; }
}

@media (max-width: 767px) {
  .amzh-top .amzj-wrap { min-height: 60px; }
  .amzh-top img { width: 112px; height: 26px; }
  .amzh-actions > a:first-child { display: none; }
  .amzj .amzh-top .amzj-btn { min-height: 40px; padding: 8px 14px; font-size: 14px; }
  .amzh-hero { padding-top: 30px; }
  .amzh-hero-grid { gap: 34px; }
  .amzh-hero .amzj-lead { font-size: 17px; }
  .amzj .amzh-cta-row .amzj-btn { width: 100%; }
  .amzh-visual-card { padding: 14px; }
  .amzh-proof { margin-top: 44px; }
  .amzh-proof-grid { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .amzh-worked li { width: 64px; }
  .amzh-worked img { width: 48px; height: 48px; }
  .amzh-offer { padding: 28px 22px; gap: 26px; }
  .amzj .amzh-offer .amzj-btn, .amzj .amzh-inline-btn { width: 100%; }
  .amzh-copilot-intro { margin-top: 40px; padding-top: 40px; gap: 30px; }
  .amzh-coach img { height: 340px; }
  .amzh-row { margin-top: 52px; gap: 26px; }
  .amzh-tools-head, .amzh-voices-head, .amzh-recap { margin-top: 56px; }
  .amzh-recap { padding: 34px 22px; }
  .amzh-wall { columns: 1; }
  .amzh-wall.is-short .amzj-quote:nth-child(n + 5) { display: none; }
  .amzh-hide-sm { display: none; }
  .amzh-tools p + p { display: none; }
  .amzj .amzh-inline-btn, .amzj .amzh-close-card .amzj-btn { padding: 14px 12px; font-size: 15px; }
  .amzh-note { gap: 30px; }
  .amzh-close-card { padding: 26px 22px; }
}

/* /upgrade-now and /upgrade-now-offer additions. Loaded after
   output/membership-join-page/styles.css and output/homepage-v2/home.css, so both
   pages reuse the shared design system (.amzj tokens, buttons, panels, plans,
   quotes, FAQ) and the homepage components (.amzh-bullets, .amzh-proof).
   Only what is genuinely new to these two pages lives here. */

/* ---------- Header ---------- */
/* The join page hides .amzj-header-meta spans on phones because its span is a
   "Secure checkout" decoration. Here the span is the support phone number, which
   is the only meta content on the page, so it stays and wraps instead. */
.amzj .amzj-header-meta .amzu-phone { display: inline; color: #cbd5e1; }

/* The masthead sits above <main> so the skip link lands on the hero, which is why
   it is a band of its own rather than the first row inside .amzj-hero. */
.amzu-mast { background: var(--bg); }

/* ---------- Hero ---------- */
.amzu-hero .amzj-hero-copy { padding-top: 26px; }
.amzu-hero--short { padding-bottom: 56px; }
.amzu-hero--short .amzj-hero-copy { padding-bottom: 8px; }
.amzu-h1 em { display: block; }
.amzj-hero-copy .amzu-legal { max-width: 620px; margin: 0 auto; text-align: center; }

/* Centred call to action: the shared .amzj-btn is full width by default, which is
   right inside a plan card and wrong under a centred hero paragraph. */
.amzu-cta { display: grid; justify-items: center; gap: 16px; margin-top: 6px; }
.amzj .amzu-cta .amzj-btn { width: auto; min-width: 280px; margin: 0; padding: 16px 30px; }

/* Shield chips on a dark section. .amzj-chips is built for light panels, so the
   dark variant restates only colour, never layout. */
.amzj-dark .amzu-chips { justify-content: center; }
.amzj-dark .amzu-chips li { display: inline-flex; align-items: center; gap: 8px; border-color: rgba(148, 163, 184, 0.38); background: rgba(30, 41, 59, 0.72); color: #e2e8f0; }
.amzj-dark .amzu-chips li svg { width: 18px; height: 18px; flex: none; color: var(--success); }

/* ---------- Shared layout ---------- */
.amzu-single { max-width: 860px; margin: 0 auto; }
.amzu-single--form { max-width: 640px; }
.amzu-single--panels { display: grid; gap: 24px; max-width: 900px; }
.amzj-head .amzj-value-tag { margin-top: 2px; }
.amzj-panel .amzj-legal { margin: 0 auto; }

/* .amzj-legal is written for dark sections (muted grey on navy). On paper or white
   that grey fails contrast, so light sections get the ink-muted token instead. */
.amzj-light .amzj-legal { color: var(--ink-muted); }
.amzj-light .amzj-legal a { color: var(--brand-on-light) !important; }
.amzj-light .amzj-legal b { color: var(--ink); }

/* ---------- What happens next ---------- */
.amzu-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 960px; margin: 0 auto; }
.amzu-steps li { padding: 20px 22px; }
.amzu-steps strong { font-size: 17px; letter-spacing: -0.01em; }
.amzu-steps span { margin-top: 6px; }

/* ---------- Proof band ---------- */
/* .amzh-proof is built to hang off the bottom of the homepage hero. Here it is a
   standalone dark band, so the hero's top margin comes off. */
.amzu-band { background: var(--bg); }
.amzu-band .amzh-proof { margin-top: 0; }
.amzu-band .amzh-proof-grid { grid-template-columns: auto minmax(0, 1fr); }

/* ---------- Platinum plans ---------- */
/* Two equal-height cards. "Join Amazing Academy Platinum" is a long label, so the
   button keeps one line by trading padding and icon, never by wrapping. */
.amzu-plans { max-width: 820px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.amzu-plans .amzj-plan { padding: 30px 26px 26px; }
.amzj .amzu-plans .amzj-btn { white-space: nowrap; padding: 16px 18px; font-size: 16px; }
.amzu-plans .amzj-price { margin-top: 16px; }
.amzu-plans .amzj-price strong { font-size: clamp(36px, 4vw, 48px); }
.amzu-offer-legal { margin-top: 26px; text-align: center; }

/* ---------- Close ---------- */
.amzj .amzu-cta--close .amzj-btn { min-width: 300px; }

/* ---------- Sticky bar ---------- */
/* These bars carry the call to action alone, with no price line beside it, so the
   button takes the row and must never wrap. */
.amzu-sticky { justify-content: stretch; }
.amzj .amzu-sticky .amzj-btn { flex: 1 1 auto; width: auto; white-space: nowrap; }

/* ---------- The HubSpot form on /upgrade-now ---------- */
/* Styles for the raw-HTML render of form 85f43f59-bbb0-4327-a0a7-5659058104c3
   (first name, last name, email, phone, a text-alerts checkbox, a "do you sell
   online" select or radio group, and hidden UTM fields). Written in the same
   spirit as the single-field styles in scripts/update-start-risk-free-form-module.mjs,
   but stacked, because this form has nine fields.

   Checked on 2026-09-21 in headless Edge against the real form: it renders today
   inside <iframe class="hs-form-iframe">, so none of the control rules below apply
   yet and the form keeps HubSpot's default look. The container is therefore a
   plain measure inside the white .amzj-panel with no border or fill of its own,
   which reads as intentional whichever way the form arrives, and the min-height
   holds the space while it loads so nothing jumps. .amzu-form > * centres either
   the frame or the raw <form> at the same 560px. */
.amzu-form {
  min-height: 340px;
  padding: 0;
}
.amzu-form > * { max-width: 560px; margin-left: auto; margin-right: auto; }
.amzu-form > iframe { display: block; width: 100%; border: 0; }
.amzu-form-loading { padding: 20px 0; color: var(--ink-muted); font-size: 15px; text-align: center; }

.amzu-form form { display: grid; gap: 16px; max-width: 560px; margin: 0 auto; padding: 0; border: 0; }
.amzu-form .hs-form-field { min-width: 0; margin: 0; }
.amzu-form .hs-form-field > label { display: block; margin: 0 0 6px; color: var(--ink); font-size: 14px; font-weight: 600; line-height: 1.3; }
.amzu-form .hs-form-field > label .hs-form-required { margin-left: 2px; color: var(--brand-on-light); }
.amzu-form .hs-field-desc { display: block; margin: 0 0 6px; color: var(--ink-muted); font-size: 13px; }
.amzu-form legend { padding: 0; border: 0; }

.amzu-form input[type="text"],
.amzu-form input[type="email"],
.amzu-form input[type="tel"],
.amzu-form input[type="number"],
.amzu-form select {
  box-sizing: border-box;
  width: 100%;
  height: 56px;
  margin: 0;
  padding: 0 20px;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  background: #ffffff;
  color: var(--ink);
  font-family: inherit;
  font-size: 16px;
  line-height: 1.2;
}
.amzu-form select {
  padding-right: 46px;
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%230f172a'%3E%3Cpath fill-rule='evenodd' d='M5.3 7.3a1 1 0 0 1 1.4 0L10 10.6l3.3-3.3a1 1 0 1 1 1.4 1.4l-4 4a1 1 0 0 1-1.4 0l-4-4a1 1 0 0 1 0-1.4Z' clip-rule='evenodd'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 18px center;
  background-size: 20px 20px;
}
.amzu-form input::placeholder { color: #94a3b8; }
.amzu-form input:focus,
.amzu-form input:focus-visible,
.amzu-form select:focus,
.amzu-form select:focus-visible {
  border-color: var(--brand);
  outline: 3px solid var(--brand);
  outline-offset: 2px;
}

/* Checkbox and radio groups: HubSpot renders both as ul.inputs-list. */
.amzu-form .inputs-list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.amzu-form .inputs-list > li { margin: 0; }
.amzu-form .inputs-list label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  color: var(--ink-2);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.45;
  cursor: pointer;
}
.amzu-form input[type="checkbox"],
.amzu-form input[type="radio"] {
  flex: none;
  width: 20px;
  height: 20px;
  margin: 1px 0 0;
  accent-color: var(--brand);
}
.amzu-form .hs-fieldtype-radio .inputs-list > li,
.amzu-form .hs-fieldtype-checkbox .inputs-list > li {
  padding: 13px 16px;
  border: 1px solid #cbd5e1;
  border-radius: 14px;
  background: #ffffff;
}

.amzu-form .hs_submit, .amzu-form .hs_submit .actions { margin: 0; padding: 0; }
/* The theme paints .hs-button with its own colours, a chevron background image and
   square inner corners, so the pill and its colours are forced here. */
.amzu-form input[type="submit"] {
  box-sizing: border-box;
  width: 100%;
  min-height: 56px;
  margin: 4px 0 0;
  padding: 16px 24px;
  border: 2px solid var(--brand) !important;
  border-radius: 999px !important;
  background-color: var(--brand) !important;
  background-image: none !important;
  color: var(--ink) !important;
  font-family: inherit;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.25;
  text-align: center;
  cursor: pointer;
  transition: background-color 180ms ease;
}
.amzu-form input[type="submit"]:hover,
.amzu-form input[type="submit"]:focus {
  background-color: #fb8a3c !important;
  border-color: #fb8a3c !important;
  color: var(--ink) !important;
}
.amzu-form input[type="submit"]:focus-visible { outline: 3px solid var(--brand); outline-offset: 3px; }

/* Errors stay in flow in a stacked form, so they push the next field down by one
   line instead of overlapping it or knocking the submit button out of the layout. */
.amzu-form .hs-error-msgs { display: grid; gap: 2px; margin: 6px 0 0; padding: 0; list-style: none; }
.amzu-form .hs-error-msgs label { display: block; margin: 0; color: #b91c1c; font-size: 14px; font-weight: 500; line-height: 1.4; }
.amzu-form .hs_error_rollup { margin: 0; }
.amzu-form .hs_error_rollup .hs-error-msgs label { text-align: center; }
.amzu-form .submitted-message { color: var(--ink-2); font-size: 16px; text-align: center; }

@media (prefers-reduced-motion: reduce) {
  .amzu-form input[type="submit"] { transition: none; }
}

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .amzu-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .amzj .amzj-header-meta { font-size: 13px; text-align: right; }
  .amzu-steps, .amzu-plans { grid-template-columns: minmax(0, 1fr); }
  .amzu-plans { gap: 26px; }
  .amzj .amzu-cta .amzj-btn, .amzj .amzu-cta--close .amzj-btn { width: 100%; min-width: 0; }
  .amzu-form { min-height: 380px; }
  .amzu-band .amzh-proof-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 420px) {
  /* At this width the arrow is what pushes "Join Amazing Academy Platinum" onto a
     second line, so the decoration goes and the label stays on one. */
  .amzj .amzu-plans .amzj-btn { padding: 14px 12px; font-size: 15px; }
  .amzj .amzu-plans .amzj-btn svg, .amzj .amzu-cta--close .amzj-btn svg { display: none; }
  .amzj .amzu-cta--close .amzj-btn { font-size: 16px; }
}

/* /asm-upgrade and /asm-upgrade-special additions.

   Loaded after, in this order:
     output/membership-join-page/styles.css   (.amzj tokens, buttons, panels, quotes, faq)
     output/homepage-v2/home.css              (.amzh-bullets, .amzh-show-all, .amzh-skip)
     output/upgrade-pages/upgrade.css         (.amzu-mast, .amzu-cta, .amzu-single, .amzu-form, .amzu-sticky)

   Those three files are read, never edited. Only what is genuinely new to these
   two pages lives here, under the .amzr- prefix. */

/* ---------- Rich text carried over from the live pages ----------
   Both pages are mostly long-form rich text (Mike's letter, the offer bullets,
   the bonus block). .amzr-prose is the one place that copy gets its rhythm, so
   the body files stay plain semantic HTML. */
.amzr-prose { display: grid; gap: 16px; }
.amzr-prose p { color: var(--ink-2); font-size: 17px; line-height: 1.7; }
.amzr-prose p b, .amzr-prose p strong { color: var(--ink); }
.amzr-prose h3 { color: var(--ink); font-size: 22px; font-weight: 800; line-height: 1.25; letter-spacing: -0.015em; }
.amzr-prose hr { height: 1px; margin: 6px 0; border: 0; background: var(--card-line); }
.amzr-prose ul, .amzr-prose ol { display: grid; gap: 12px; margin: 2px 0; }
.amzr-prose li { position: relative; padding-left: 30px; color: var(--ink-2); font-size: 17px; line-height: 1.6; }
.amzr-prose li b, .amzr-prose li strong { color: var(--ink); }
.amzr-prose ul > li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 11px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand);
}
.amzr-prose ol { counter-reset: amzr-step; }
.amzr-prose ol > li { counter-increment: amzr-step; }
.amzr-prose ol > li::before {
  content: counter(amzr-step);
  position: absolute;
  left: 0;
  top: 2px;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(249, 115, 22, 0.14);
  color: var(--brand-on-light);
  font-size: 12px;
  font-weight: 800;
}
.amzr-sign { margin-top: 4px; }
.amzr-sign b { color: var(--ink); }

/* Quotes lifted out of the bonus copy. They are event feedback, not member
   stories, so they use the small quiet treatment rather than .amzj-quote. */
.amzr-says { display: grid; gap: 14px; margin: 4px 0; padding-left: 22px; border-left: 3px solid #fdba74; }
.amzr-says figure { display: grid; gap: 4px; }
.amzr-says blockquote { color: var(--ink); font-size: 17px; font-style: italic; line-height: 1.55; }
.amzr-says figcaption { color: var(--ink-muted); font-size: 14px; }

/* ---------- Page 1 layout: letter beside the form ---------- */
.amzr-split { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: 40px; align-items: start; }
.amzr-split > * { min-width: 0; }
.amzr-aside { position: sticky; top: 24px; display: grid; gap: 20px; }
.amzr-aside .amzj-panel { gap: 18px; }
.amzr-aside h3 { color: var(--ink); font-size: 20px; font-weight: 700; line-height: 1.35; }
/* Checked in headless Edge on 2026-09-21: HubSpot renders form
   1b5f0739-098a-4f3b-9313-47f3f1aca5f8 inside <iframe class="hs-form-iframe">,
   about 294px tall, so none of the .amzu-form control rules reach it and it
   keeps HubSpot's own look. The min-height holds the space while it loads;
   340px (the .amzu-form default) left a visible gap under the submit button. */
.amzr-aside .amzu-form { min-height: 300px; }

/* ---------- Video ----------
   Click-to-load facade. Nothing third-party is requested until the play button
   is pressed, which is why the page carries no <iframe> of its own. 16:9 and the
   same 16px radius as the cards. */
.amzr-video {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: radial-gradient(120% 120% at 50% 0%, #223049, #0b1424 70%);
}
.amzr-video > iframe, .amzr-video > .voomly-embed { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.amzr-video-play {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.amzr-video-play span {
  display: grid;
  place-items: center;
  width: 86px;
  height: 86px;
  border-radius: 50%;
  background: var(--brand);
  box-shadow: 0 18px 44px rgba(2, 6, 23, 0.55);
  transition: transform 180ms ease, background-color 180ms ease;
}
.amzr-video-play svg { width: 34px; height: 34px; margin-left: 5px; color: var(--ink); }
.amzr-video-play:hover span { background: #fb8a3c; transform: scale(1.06); }
.amzr-video-play:focus-visible { outline: 3px solid var(--brand); outline-offset: -6px; border-radius: var(--radius); }
.amzj-light .amzr-video { border-color: var(--card-line); }

/* ---------- Live sales ticker ----------
   Same numbers, same endpoint and same fallbacks as the live module
   (Amazing_Theme_Nov_2024 module 203812959133). */
.amzr-ticker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; max-width: 760px; margin: 0 auto; }
.amzr-ticker div { padding: 20px 22px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(15, 23, 42, 0.55); text-align: center; }
.amzr-ticker dt { color: var(--muted); font-size: 14px; }
.amzr-ticker dd {
  margin: 4px 0 0;
  color: var(--heading);
  font-size: clamp(24px, 3vw, 34px);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
  line-height: 1.15;
}

/* ---------- Offer / price box ----------
   Used three times across the two pages, so every price box is the same
   component and they cannot drift apart in height or styling. */
.amzr-offer {
  display: grid;
  gap: 10px;
  justify-items: center;
  max-width: 720px;
  margin: 0 auto;
  padding: 32px 30px;
  border: 2px solid var(--brand);
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, #fff7ed, #ffffff 60%);
  text-align: center;
}
.amzj-dark .amzr-offer { background: linear-gradient(180deg, rgba(249, 115, 22, 0.14), rgba(30, 41, 59, 0.9) 45%); }
.amzr-offer h3 { color: var(--brand-on-light); font-size: clamp(20px, 2.4vw, 26px); font-weight: 800; line-height: 1.25; }
.amzj-dark .amzr-offer h3 { color: #fdba74; }
.amzr-offer p { color: var(--ink-2); font-size: 16px; line-height: 1.6; }
/* Scoped to .amzr-offer so it outweighs the paragraph rule above it. */
.amzr-offer .amzr-price { color: var(--ink); font-size: clamp(19px, 2.2vw, 26px); font-weight: 800; letter-spacing: -0.02em; line-height: 1.3; }
.amzj-dark .amzr-offer .amzr-price { color: var(--heading); }
.amzr-offer .amzr-price s { color: var(--ink-muted); font-weight: 600; }
.amzj-dark .amzr-offer .amzr-price s { color: var(--muted); }
.amzr-offer .amzr-price em { color: var(--brand-on-light); font-style: normal; }
.amzj-dark .amzr-offer .amzr-price em { color: var(--brand); }
.amzj-dark .amzr-offer p { color: #cbd5e1; }
.amzr-offer p b { color: var(--ink); }
.amzj-dark .amzr-offer p b { color: var(--heading); }

/* Centred call to action. .amzj-btn is full width by default, which is right in
   a plan card and wrong under a centred paragraph. */
.amzr-cta { display: grid; justify-items: center; gap: 14px; margin-top: 26px; }
.amzj .amzr-cta .amzj-btn { width: auto; min-width: 300px; margin: 0; padding: 16px 30px; }

/* The sentence that closes the offer. It is body copy on the live page, not
   small print, so it keeps body size rather than the 13px legal size. */
.amzr-closing { max-width: 640px; margin: 22px auto 0; color: var(--ink-2); font-size: 17px; line-height: 1.6; text-align: center; }
.amzr-closing b { color: var(--ink); }

/* ---------- Three pillars: software, training, coaching ---------- */
.amzr-pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.amzr-pillars > article { display: grid; gap: 14px; align-content: start; }
.amzr-pillars .amzr-prose { gap: 12px; }
.amzr-pillars .amzr-prose p, .amzr-pillars .amzr-prose li { font-size: 15px; line-height: 1.55; }
.amzr-pillars .amzr-prose h3 { font-size: 20px; }
.amzr-icon { width: 40px; height: 32px; object-fit: contain; object-position: left center; }
.amzr-lede { color: var(--ink); font-weight: 700; }
.amzr-brandmark { width: 247px; height: 56px; margin: 0 auto 6px; object-fit: contain; }

/* ---------- Member wall ---------- */
.amzr-members { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; }
.amzr-members li {
  display: grid;
  gap: 10px;
  padding: 12px 12px 16px;
  border: 1px solid var(--card-line);
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 10px 26px rgba(15, 23, 42, 0.05);
  text-align: center;
}
.amzr-members img { width: 100%; aspect-ratio: 1 / 1; border-radius: 12px; object-fit: cover; object-position: 50% 22%; background: var(--paper); }
.amzr-members strong { display: block; color: var(--ink); font-size: 15px; line-height: 1.3; }
.amzr-members span { display: block; color: var(--ink-muted); font-size: 13px; line-height: 1.4; }
.amzr-collapse { display: grid; gap: 20px; }

/* ---------- Star reviews (the three faces above the footer) ---------- */
.amzr-faces { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; max-width: 1040px; margin: 0 auto; }
.amzr-faces figure { display: grid; gap: 14px; justify-items: center; }
.amzr-faces img { width: 100%; max-width: 340px; border-radius: var(--radius); object-fit: cover; }
.amzr-faces figcaption { display: grid; gap: 8px; justify-items: center; }
.amzr-faces figcaption strong { color: var(--heading); font-size: 17px; font-weight: 700; }
.amzr-stars { display: flex; gap: 5px; }
.amzr-stars svg { width: 18px; height: 18px; color: #f0592f; }

/* ---------- As seen in ---------- */
.amzr-logos { display: grid; gap: 22px; justify-items: center; }
.amzr-logos > p { color: var(--ink-muted); font-size: 12px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.amzr-logos ul { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 22px 44px; }
.amzr-logos img { max-height: 34px; width: auto; opacity: 0.72; filter: grayscale(1); }

/* ---------- Dark brand band ---------- */
.amzr-band { display: grid; gap: 12px; justify-items: center; max-width: 900px; margin: 0 auto 48px; text-align: center; }
.amzr-band p { color: #cbd5e1; font-size: 17px; }

/* ---------- Sticky bar ----------
   Carries the call to action alone, with no price beside it, so the button takes
   the whole row and must never wrap. */
.amzr-sticky { justify-content: stretch; }
.amzj .amzr-sticky .amzj-btn { flex: 1 1 auto; width: auto; white-space: nowrap; }

/* .amzj-legal is written for dark sections (muted grey on navy); on white that
   grey fails contrast, so light sections get the ink-muted token instead. */
.amzj-light .amzj-legal { color: var(--ink-muted); }
.amzj-light .amzj-legal b { color: var(--ink); }

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  .amzr-members { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 960px) {
  .amzr-split { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .amzr-aside { position: static; }
  .amzr-pillars { grid-template-columns: minmax(0, 1fr); }
  .amzr-members { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .amzr-faces { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}

@media (max-width: 767px) {
  .amzr-prose p, .amzr-prose li { font-size: 16px; }
  .amzr-offer { padding: 26px 20px; }
  .amzj .amzr-cta .amzj-btn { width: 100%; min-width: 0; padding: 14px 14px; font-size: 15px; }
  .amzj .amzr-cta .amzj-btn svg { display: none; }
  .amzr-ticker { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .amzr-members { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .amzr-members.is-short li:nth-child(n + 7) { display: none; }
  .amzr-logos ul { gap: 18px 26px; }
  .amzr-logos img { max-height: 26px; }
  .amzr-band { margin-bottom: 34px; }
  .amzr-video-play span { width: 66px; height: 66px; }
  .amzr-video-play svg { width: 26px; height: 26px; }
  .amzr-says { padding-left: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .amzr-video-play span { transition: none; }
}

.migration-notice{font:16px/1.5 Inter,Arial,sans-serif;background:#fff7ed;color:#7c2d12;padding:16px 24px;text-align:center;border-bottom:1px solid #fed7aa}.migration-notice strong{margin-right:8px}body{margin:0;background:#0f172a}