/* Public Creator Pass and activation. Active memberships retain workspace styling. */
body[data-public-page="offer"] .public-page .creator-pass {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr);
  grid-template-rows: auto auto 1fr auto;
  align-items: start;
  width: min(1120px, 100%);
  height: auto;
  min-height: 0;
  margin: 0 auto;
  padding: 28px 0 36px;
  gap: 28px 64px;
  color: var(--page-neutral);
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-back {
  grid-column: 1 / -1;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  text-decoration: none;
  text-underline-offset: 4px;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-hero {
  grid-column: 1;
  grid-row: 2;
  justify-items: start;
  gap: 16px;
  padding: 0;
  text-align: left;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-kicker {
  color: var(--page-primary);
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .1em;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-heading {
  max-width: 15ch;
  margin: 0;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: clamp(44px, 5.4vw, 68px);
  font-weight: 700;
  line-height: 1.04;
  letter-spacing: -.055em;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-heading > span {
  color: var(--page-primary);
}

body[data-public-page="offer"] .public-page .creator-pass .buy-lead {
  max-width: 43ch;
  margin: 0;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: 0;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-purchase {
  grid-column: 2;
  grid-row: 2 / 4;
  width: 100%;
  justify-items: stretch;
  gap: 18px;
  padding: 28px;
  border: 1px solid var(--page-secondary);
  border-radius: 20px;
  background: var(--page-background);
  box-shadow: none;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-trial {
  margin: 0;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  text-align: left;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-price {
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: flex-start;
  gap: 10px;
  margin: -6px 0 2px;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-price-value {
  color: var(--page-primary);
  font-family: inherit;
  font-size: clamp(44px, 4.5vw, 58px);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -.055em;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-price-term {
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .025em;
}

body[data-public-page="offer"] .public-page .creator-pass button.buy-primary.purchase-action {
  width: 100%;
  min-height: 54px;
  padding: 14px 16px;
  border: 1px solid var(--cta-background) !important;
  border-radius: 999px;
  background: var(--cta-background) !important;
  box-shadow: none !important;
  color: var(--cta-neutral) !important;
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0;
  white-space: normal;
  transition: transform 180ms ease;
}

body[data-public-page="offer"] .public-page .creator-pass button.buy-primary.purchase-action:hover:not(:disabled) {
  transform: translateY(-1px);
}

body[data-public-page="offer"] .public-page .creator-pass button.buy-primary.purchase-action:disabled {
  cursor: not-allowed;
}

body[data-public-page="offer"] .public-page .creator-pass :is(.buy-cancellation, .creator-pass-steps, .creator-pass-limits) {
  max-width: none;
  margin: 0;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0;
  text-align: left;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-steps {
  padding-top: 16px;
  border-top: 1px solid var(--page-secondary);
}

body[data-public-page="offer"] .public-page .creator-pass .buy-renewal {
  width: fit-content;
  margin: -4px 0 0;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-align: left;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-code {
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.7;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-code > summary {
  width: fit-content;
  min-height: 28px;
  cursor: pointer;
  text-align: left;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-creator-code {
  margin-top: 14px;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-creator-code label {
  display: grid;
  gap: 8px;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-creator-code input {
  width: 100%;
  min-height: 46px;
  border: 1px solid var(--page-secondary);
  border-radius: 8px;
  background: var(--page-background);
  color: var(--page-neutral);
  padding: 10px 12px;
  font-family: inherit;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-creator-code input::placeholder {
  color: var(--page-neutral);
  opacity: 1;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-creator-code p {
  margin: 10px 0 0;
  line-height: 1.6;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-included {
  grid-column: 1;
  grid-row: 3;
  padding: 12px 0 0;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-included > h2 {
  margin: 0 0 12px;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -.02em;
  text-align: left;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-grid .buy-product {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  align-items: center;
  min-height: 0;
  padding: 14px 0;
  gap: 14px;
  border: 0;
  border-top: 1px solid var(--page-secondary);
  border-radius: 0;
  background: transparent;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-grid .buy-product-media {
  align-self: center;
  width: 48px;
  height: 58px;
  border: 0;
  border-radius: 7px;
  background: var(--page-background);
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-grid .buy-product-copy {
  display: grid;
  gap: 4px;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-grid .buy-product-label {
  margin: 0;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -.015em;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-grid .buy-product-detail {
  max-width: none;
  margin: 0;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-limits {
  margin: 10px 0 0;
  font-size: 14px;
}

body[data-public-page="offer"] .public-page .creator-pass .creator-pass-error,
body[data-public-page="offer"] .public-page .creator-pass .affiliate-inline-error {
  margin: 0;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
  text-align: left;
}

body[data-public-page="offer"] .public-page .creator-pass .secondary-action {
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid var(--page-neutral);
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-footer {
  grid-column: 1 / -1;
  grid-row: 4;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 24px;
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--page-secondary);
  color: var(--page-neutral);
  font-family: inherit;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-recovery summary {
  display: flex;
  align-items: center;
  min-height: 44px;
  border: 0;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0;
  text-decoration: underline;
  text-underline-offset: 4px;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-recovery-menu {
  display: grid;
  grid-template-columns: 1fr;
  left: 0;
  bottom: calc(100% + 8px);
  width: max-content;
  max-width: min(320px, 85vw);
  padding: 8px;
  gap: 4px;
  border: 1px solid var(--page-neutral);
  border-radius: 10px;
  background: var(--page-background);
  box-shadow: none;
  transform: none;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-recovery-action,
body[data-public-page="offer"] .public-page .creator-pass .buy-legal a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: var(--page-neutral);
  padding: 8px 0;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .025em;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-recovery-action {
  padding: 10px 12px;
}

body[data-public-page="offer"] .public-page .creator-pass .buy-legal {
  gap: 20px;
}

body[data-public-page="offer"] .public-page .creator-pass :is(a, button, summary, input):focus-visible {
  outline: 2px solid var(--page-primary);
  outline-offset: 4px;
}

@media (max-width: 900px) {
  body[data-public-page="offer"] .public-page .creator-pass {
    grid-template-columns: minmax(0, 1fr) minmax(310px, 1fr);
    gap: 24px 32px;
  }

  body[data-public-page="offer"] .public-page .creator-pass .creator-pass-purchase {
    padding: 22px;
  }
}

@media (max-width: 680px) {
  body[data-public-page="offer"] .public-page .creator-pass {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
    width: 100%;
    padding: 10px 0 28px;
    gap: 24px;
  }

  body[data-public-page="offer"] .public-page .creator-pass > * {
    grid-column: 1;
    grid-row: auto;
  }

  body[data-public-page="offer"] .public-page .creator-pass .creator-pass-back {
    grid-column: 1;
    margin-bottom: -8px;
  }

  body[data-public-page="offer"] .public-page .creator-pass .buy-hero {
    grid-column: 1;
    grid-row: auto;
    gap: 12px;
  }

  body[data-public-page="offer"] .public-page .creator-pass .buy-heading {
    font-size: clamp(38px, 11vw, 52px);
    line-height: 1.04;
  }

  body[data-public-page="offer"] .public-page .creator-pass .buy-lead {
    max-width: 39ch;
    font-size: 16px;
    line-height: 1.6;
  }

  body[data-public-page="offer"] .public-page .creator-pass .creator-pass-purchase {
    grid-column: 1;
    grid-row: auto;
    padding: 22px 20px;
    gap: 16px;
    border-radius: 16px;
  }

  body[data-public-page="offer"] .public-page .creator-pass .buy-price-value {
    font-size: 48px;
  }

  body[data-public-page="offer"] .public-page .creator-pass .creator-pass-included {
    grid-column: 1;
    grid-row: auto;
    padding-top: 4px;
  }

  body[data-public-page="offer"] .public-page .creator-pass .buy-footer {
    grid-column: 1;
    grid-row: auto;
    margin-top: 0;
  }
}

/* The pass overview is a short bridge from a product to checkout. */
body[data-public-page="offer"] .public-page .creator-pass-compact{width:min(980px,100%);padding:0 0 8px;gap:22px 48px;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr)}
body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-back{min-height:32px}
body[data-public-page="offer"] .public-page .creator-pass-compact .buy-hero{gap:10px}
body[data-public-page="offer"] .public-page .creator-pass-compact .buy-kicker{font-size:12px;letter-spacing:.09em}
body[data-public-page="offer"] .public-page .creator-pass-compact .buy-heading{max-width:none;font-size:clamp(32px,4.1vw,48px);line-height:1.12;letter-spacing:-.045em}
body[data-public-page="offer"] .public-page .creator-pass-compact .buy-heading>span{display:block}
body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-included{padding:0}
body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-grid .buy-product{grid-template-columns:52px minmax(0,1fr);padding:15px 0;gap:14px;border:0}
body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-grid .buy-product-media{width:52px;height:64px;border-radius:10px;overflow:hidden;background:#000}
body[data-public-page="offer"] .public-page .creator-pass-compact .buy-product-media img{width:100%;height:100%;object-fit:cover}
body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-grid .buy-product-label{color:var(--page-primary);font-size:16px;line-height:1.3}
body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-grid .buy-product:nth-child(2) .buy-product-label{color:var(--page-secondary)}
body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-grid .buy-product-detail{font-size:15px;line-height:1.45}
body[data-public-page="offer"] .public-page .creator-pass-compact .buy-product-modes:empty{display:none}
body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-purchase{gap:12px;padding:24px;text-align:left}
body[data-public-page="offer"] .public-page .creator-pass-compact .buy-cancellation{font-size:13px;line-height:1.55}
body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-steps{padding:0;border:0;font-size:13px;line-height:1.55}
body[data-public-page="offer"] .public-page .creator-pass-compact .buy-renewal{font-size:12px;line-height:1.6;margin:0}
body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-code{font-size:13px;line-height:1.5}
body[data-public-page="offer"] .public-page .creator-pass-compact .buy-footer{padding-top:6px;gap:4px 20px}
body[data-public-page="offer"] .public-page .creator-pass-compact .buy-recovery summary,
body[data-public-page="offer"] .public-page .creator-pass-compact .buy-legal a{font-size:12px}
@media(max-width:680px){
  body.has-site-shell[data-public-page="offer"] .wizard-root.public-page{padding:16px 20px 24px!important}
  body[data-public-page="offer"] .public-page .creator-pass-compact{grid-template-columns:minmax(0,1fr);gap:16px}
  body[data-public-page="offer"] .public-page .creator-pass-compact .buy-heading{font-size:clamp(29px,8.7vw,42px)}
  body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-purchase{padding:0;border:0;background:transparent;gap:10px}
  body[data-public-page="offer"] .public-page .creator-pass-compact .creator-pass-grid .buy-product{padding:10px 0}
  body[data-public-page="offer"] .public-page .creator-pass-compact .buy-footer{margin-top:0}
}

/* Purchase activation and recovery are public only until access is confirmed. */
body[data-public-page="activation"] .public-page .page-title {
  width: min(680px, 100%);
  margin: 12px auto 24px;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: clamp(32px, 5vw, 48px);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -.045em;
  text-align: left;
  text-transform: none;
}

body[data-public-page="activation"] .public-page .billing-return-panel {
  width: min(680px, 100%);
  margin: 0 auto;
  gap: 16px;
  border: 1px solid var(--page-secondary);
  border-radius: 20px;
  background: var(--page-background);
  padding: 28px;
  text-align: left;
}

body[data-public-page="activation"] .public-page :is(.billing-return-kicker, .billing-return-small, .billing-license-help) {
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0;
  text-transform: none;
}

body[data-public-page="activation"] .public-page .billing-return-kicker {
  color: var(--page-primary);
  font-weight: 700;
}

body[data-public-page="activation"] .public-page .billing-return-status {
  color: var(--page-neutral);
  font-family: inherit;
  font-size: clamp(24px, 4vw, 32px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.025em;
}

body[data-public-page="activation"] .public-page :is(.billing-return-copy, .billing-license-copy, .billing-license-heading) {
  max-width: none;
  margin: 0;
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0;
}

body[data-public-page="activation"] .public-page .billing-license-heading {
  font-weight: 700;
}

body[data-public-page="activation"] .public-page .billing-license-recovery {
  gap: 12px;
  margin-top: 8px;
  padding-top: 24px;
  border-top: 1px solid var(--page-secondary);
}

body[data-public-page="activation"] .public-page .billing-license-form-row {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
}

body[data-public-page="activation"] .public-page .billing-license-input {
  min-height: 50px;
  padding: 12px 14px;
  border: 1px solid var(--page-secondary);
  border-radius: 10px;
  background: var(--page-background);
  color: var(--page-neutral);
  font-family: inherit;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
}

body[data-public-page="activation"] .public-page .billing-license-input::placeholder {
  color: var(--page-neutral);
  opacity: 1;
}

body[data-public-page="activation"] .public-page :is(.billing-license-submit, .bottom-actions .primary-action) {
  min-width: 0;
  min-height: 50px;
  border: 1px solid var(--page-secondary);
  border-radius: 999px;
  background: var(--page-background);
  box-shadow: none;
  color: var(--page-neutral);
  padding: 12px 22px;
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0;
  text-transform: none;
  transition: transform 180ms ease;
}

body[data-public-page="activation"] .public-page .bottom-actions {
  display: flex;
  justify-content: flex-start;
  width: min(680px, 100%);
  margin: 20px auto 0;
  gap: 12px;
}

body[data-public-page="activation"] .public-page .bottom-actions .primary-action {
  min-width: 180px;
  border-color: var(--cta-background);
  background: var(--cta-background);
  color: var(--cta-neutral);
}

body[data-public-page="activation"] .public-page .billing-license-input:focus,
body[data-public-page="activation"] .public-page :is(button, input):focus-visible {
  outline: 2px solid var(--page-secondary);
  outline-offset: 4px;
}

@media (max-width: 600px) {
  body[data-public-page="activation"] .public-page .billing-return-panel {
    padding: 22px 18px;
    border-radius: 16px;
  }

  body[data-public-page="activation"] .public-page .billing-license-form-row {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-public-page="activation"] .public-page .bottom-actions .primary-action {
    width: 100%;
  }
}
