
.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; }
}

.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}