/* Package presentation, scoped to the public introduction. */
body.intro-page #mobile-landing-screen > .landing-pricing {
  width: 100%;
  max-width: 1120px;
  justify-self: center;
  padding: 48px 32px;
  border: 0;
  border-radius: 32px;
  position: relative;
  isolation: isolate;
  overflow: visible;
  background: transparent;
  box-shadow: none;
  color: #4b2912;
}
/* Fade only the decorative background; keep text and cards sharp. */
body.intro-page #mobile-landing-screen > .landing-pricing::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  transform: none;
  opacity: 1;
  background: radial-gradient(ellipse at 12% 10%, #faf2ec 0, transparent 42%), radial-gradient(ellipse at 88% 55%, #f9f4ee 0, transparent 45%);
  filter: blur(18px);
  -webkit-mask-image: linear-gradient(to right, transparent, #000 16%, #000 84%, transparent), linear-gradient(to bottom, transparent, #000 7%, #000 93%, transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent, #000 16%, #000 84%, transparent), linear-gradient(to bottom, transparent, #000 7%, #000 93%, transparent);
  mask-composite: intersect;
}
.landing-pricing *, .landing-pricing *::before, .landing-pricing *::after { box-sizing: border-box; }
body.intro-page #mobile-landing-screen #landing-pricing-title { margin: 0; font-size: calc(var(--landing-heading) * .96); font-weight: 750; line-height: 1.07; letter-spacing: -.045em; color: #071320; }
body.intro-page #mobile-landing-screen .pricing-head p { margin: 0; color: #a34d14; font-size: 18px; line-height: 1.55; }
.landing-pricing .pricing-head p strong { color: #d12854; font-weight: 600; }
.landing-pricing .pricing-head p > span { color: #847b75; }
.landing-pricing .pricing-head p > .pricing-payment-line { color: #a34d14; white-space: nowrap; }
.landing-pricing .pricing-packages { container-type: inline-size; display: grid; gap: 3cqw; }
.landing-pricing .pricing-package {
  --package-color: #bf4d00;
  --package-tint: #fcf4ef;
  --package-line: #f7ebe3;
  position: relative;
  display: grid;
  grid-template-columns: 13% minmax(0, 1fr) 18% 29%;
  grid-template-areas: "note copy unit total" "note extras extras total";
  align-items: center;
  column-gap: 2%;
  row-gap: 2cqw;
  min-width: 0;
  min-height: 23.6cqw;
  padding: 3.5cqw 3cqw;
  border: 1px solid var(--package-line);
  border-radius: 4cqw;
  background: linear-gradient(110deg,#fefbf9,#fff);
  color: var(--package-color);
  text-decoration: none;
  box-shadow: 0 1cqw 3cqw #4b291208;
  transition: border-color .2s, box-shadow .2s;
}
.landing-pricing .pricing-package-pink { --package-color: #ed0088; --package-tint: #ffe9f5; --package-line: #ffc6e7; background: linear-gradient(110deg,#fff7fc,#fffbfd); }
.landing-pricing .pricing-package-blue { --package-color: #0075ff; --package-tint: #e0f3ff; --package-line: #20b9ff; background: linear-gradient(110deg,#eaf7ff,#f7fcff); padding-top: 6cqw; min-height: 25.6cqw; }
.landing-pricing .pricing-package-gold { --package-color: #bf7900; --package-tint: #fff4d9; --package-line: #ffedc1; background: linear-gradient(110deg,#fffaf0,#fffdf7); }
.landing-pricing .pricing-package:hover { border-color: var(--package-color); box-shadow: 0 1cqw 3cqw #4b291215; }
.landing-pricing a:focus-visible { outline: 3px solid #a74500; outline-offset: 5px; }
.landing-pricing .pricing-note { grid-area: note; align-self: start; display: grid; place-items: center; width: 100%; aspect-ratio: 1; border-radius: 3.5cqw; background: var(--package-tint); }
.landing-pricing .pricing-note svg { width: 64%; height: 64%; }
.landing-pricing .pricing-package-copy { grid-area: copy; min-width: 0; }
.landing-pricing .pricing-package-copy h4 { margin: 0; color: #0f0c08; font-family: var(--font-ui); font-size: clamp(13px,5.3cqw,50px); font-weight: 750; letter-spacing: -.055em; line-height: 1.12; white-space: nowrap; }
.landing-pricing .pricing-extras { grid-area: extras; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1cqw; min-width: 0; }
.landing-pricing .pricing-extra { display: flex; align-items: center; justify-content: center; gap: .9cqw; padding: 1.1cqw .7cqw; border-radius: 6cqw; background: var(--package-tint); font-size: clamp(6px,2.05cqw,20px); letter-spacing: -.045em; line-height: 1.2; white-space: nowrap; }
.landing-pricing .pricing-extra svg { width: 2.8cqw; height: 2.8cqw; flex: 0 0 2.8cqw; }
.landing-pricing .pricing-unit { grid-area: unit; justify-self: center; display: grid; justify-items: center; gap: .5cqw; padding: 1.4cqw 1.2cqw; border-radius: 1.8cqw; background: var(--package-tint); white-space: nowrap; }
.landing-pricing .pricing-unit strong { font-size: clamp(8px,2.35cqw,23px); font-weight: 750; letter-spacing: -.04em; }
.landing-pricing .pricing-unit > span { color: #6c7a80; font-size: clamp(7px,2.05cqw,20px); }
.landing-pricing .pricing-total { grid-area: total; align-self: stretch; display: flex; flex-direction: column; justify-content: center; border-left: 1px solid var(--package-line); padding-left: 2cqw; text-align: right; color: #752f00; white-space: nowrap; }
.landing-pricing .pricing-total > strong { display: inline-flex; justify-content: flex-end; align-items: baseline; gap: .8cqw; font-size: clamp(23px,8.8cqw,84px); font-weight: 800; letter-spacing: -.07em; line-height: 1.05; }
.landing-pricing .pricing-total strong span { font-size: clamp(11px,4.1cqw,40px); letter-spacing: -.055em; font-weight: 750; }
.landing-pricing .pricing-popular { position: absolute; top: -2cqw; left: 3.2cqw; display: flex; align-items: center; gap: 1.2cqw; padding: 1.2cqw 2.6cqw; background: linear-gradient(100deg,#0068ff,#00bce9); color: white; font-size: clamp(9px,2.7cqw,26px); font-weight: 600; line-height: 1.2; border-radius: 5cqw; }
.landing-pricing .pricing-discount-row { display: flex; align-items: center; justify-content: flex-end; gap: 1.7cqw; margin-bottom: 1.5cqw; }
.landing-pricing .pricing-discount-row del { color: #7b8791; font-size: clamp(7px,2.5cqw,24px); letter-spacing: -.04em; }
.landing-pricing .pricing-discount-row > span { padding: 1cqw 2cqw; border-radius: 5cqw; background: #ff2869; color: #fff; font-size: clamp(8px,2.7cqw,26px); font-weight: 700; }
.landing-pricing .pricing-package .pricing-popular img { width: 3cqw; height: 3cqw; }
html body.intro-page #mobile-landing-screen.mobile-landing-screen .pricing-conditions { margin: 16px 6px 0; color: #847b75; font-size: 12px !important; line-height: 1.5 !important; text-align: center; }
.landing-pricing .pricing-popular img { width: 16px; height: 16px; filter: brightness(0) invert(1); }
.landing-pricing .pricing-benefits { margin-top: 24px; padding: 20px 12px 12px; background: #f7f4f1; border-radius: 24px; }
.landing-pricing .pricing-benefits-head { display: flex; align-items: center; justify-content: center; gap: 18px; padding: 0 12px 20px; }
.landing-pricing .pricing-gift { display: grid; place-items: center; flex: 0 0 58px; height: 58px; background: linear-gradient(130deg, #ff893c, #cc5200); border-radius: 50%; }
.landing-pricing .pricing-gift img { width: 30px; height: 30px; filter: brightness(0) invert(1); }
.landing-pricing .pricing-benefits-head h4 { margin: 0; font-size: 25px; line-height: 1.25; letter-spacing: -.035em; }
body.intro-page #mobile-landing-screen .pricing-benefits-head p { margin: 5px 0 0; font-size: 15px; line-height: 1.45; color: #7e756f; }
.landing-pricing .pricing-benefit-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.landing-pricing .pricing-benefit { display: grid; justify-items: center; align-content: start; padding: 16px 12px; background: #fffdfb; border: 1px solid #fff; border-radius: 16px; text-align: center; }
.landing-pricing .pricing-benefit:nth-child(3n) { background: #f4f9ff; }
.landing-pricing .pricing-benefit:nth-child(4n) { background: #fcf6ff; }
.landing-pricing .pricing-benefit:nth-child(5) { background: #fff4f9; }
.landing-pricing .pricing-benefit:nth-child(6) { background: #fffaf0; }
.landing-pricing .pricing-benefit > span { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 8px; border-radius: 50%; background: #faf2ed; color: #e15a00; font-size: 38px; line-height: 1; }
.landing-pricing .pricing-benefit:nth-child(3) > span { background: #e4f1ff; color: #0085e8; }
.landing-pricing .pricing-benefit:nth-child(6) > span { background: #fff0d4; color: #dd9200; }
.landing-pricing .pricing-benefit img, .landing-pricing .pricing-benefit svg { width: 26px; height: 26px; }
.landing-pricing .pricing-benefit h5 { margin: 0; font-size: 15px; line-height: 1.3; font-weight: 650; color: #3f2f25; }
body.intro-page #mobile-landing-screen .pricing-benefit p { margin: 5px 0 0; font-size: 13px; line-height: 1.45; color: #847b75; }
.landing-pricing .pricing-cta { display: flex; align-items: center; justify-content: center; gap: 26px; min-height: 60px; margin-top: 20px; padding: 16px 20px; border-radius: 40px; background: linear-gradient(100deg, #ff6a08, #c04b00); color: #fff; font-size: 22px; font-weight: 650; text-decoration: none; box-shadow: 0 5px 14px #d8540029; }
.landing-pricing .pricing-cta:hover { background: #c04b00; }
.landing-pricing .pricing-cta > span { font-size: 28px; line-height: 1; }
.landing-pricing .pricing-trust { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 26px 0 0; padding: 0; list-style: none; }
.landing-pricing .pricing-trust li { display: flex; align-items: center; justify-content: center; gap: 10px; }
.landing-pricing .pricing-trust li + li { border-left: 1px solid #eee9e6; }
.landing-pricing .pricing-trust svg { width: 30px; height: 30px; flex: 0 0 30px; color: #d95800; }
.landing-pricing .pricing-trust strong, .landing-pricing .pricing-trust small { display: block; font-size: 13px; line-height: 1.5; }
.landing-pricing .pricing-trust strong { font-weight: 550; }
.landing-pricing .pricing-trust small { color: #847b75; }
@media (max-width: 860px) {
  body.intro-page #mobile-landing-screen > .landing-pricing { padding: 32px 14px; border-radius: 24px; }
  .landing-pricing .pricing-head { margin-bottom: 4px; }
  body.intro-page #mobile-landing-screen #landing-pricing-title { font-size: var(--lt-h2, 30px); font-weight: 750 !important; }
  body.intro-page #mobile-landing-screen .pricing-head p { font-size: var(--lt-body, 15px); }
  .landing-pricing .pricing-head p > span { font-size: clamp(10px, 3.3vw, 13px); letter-spacing: -.02em; }
  .landing-pricing .pricing-benefits { padding: 16px 8px 8px; }
  .landing-pricing .pricing-benefits-head { gap: 12px; padding: 0 4px 16px; }
  .landing-pricing .pricing-gift { flex-basis: 44px; height: 44px; }
  .landing-pricing .pricing-gift img { width: 25px; height: 25px; }
  .landing-pricing .pricing-benefits-head h4 { font-size: var(--lt-h3, 18px); }
  body.intro-page #mobile-landing-screen .pricing-benefits-head p { font-size: var(--lt-caption, 12px); }
  .landing-pricing .pricing-benefit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .landing-pricing .pricing-benefit { padding: 14px 10px; }
  .landing-pricing .pricing-benefit h5 { font-size: var(--lt-small, 13px); }
  body.intro-page #mobile-landing-screen .pricing-benefit p { font-size: var(--lt-caption, 12px); }
  .landing-pricing .pricing-cta { min-height: 52px; font-size: var(--lt-button-lg, 18px); }
  .landing-pricing .pricing-trust { gap: 8px; }
  .landing-pricing .pricing-trust li { flex-direction: column; justify-content: flex-start; gap: 7px; text-align: center; }
  .landing-pricing .pricing-trust strong, .landing-pricing .pricing-trust small { font-size: 11px; }
}
@media (max-width: 359px) {
  body.intro-page #mobile-landing-screen #landing-pricing-title { font-size: 28px; }
}
/* Desktop uses four upright offers; the mobile composition stays unchanged. */
@media (min-width: 861px) {
  body.intro-page #mobile-landing-screen > .landing-pricing {
    left: calc(50% - min(40vw, 800px));
    width: min(80vw, 1600px);
    max-width: 1600px;
    justify-self: start;
    padding: 48px 24px;
  }
  .landing-pricing .pricing-packages { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
  body.intro-page #mobile-landing-screen #landing-pricing-title { font-size: calc(var(--landing-heading) * .96); }
  body.intro-page #mobile-landing-screen .pricing-head p { font-size: calc(var(--landing-body) * .96); }
  .landing-pricing .pricing-package {
    container-type: inline-size;
    grid-template-columns: 29% minmax(0, 1fr);
    grid-template-areas: "note copy" "extras extras" "total total" "unit unit";
    grid-template-rows: auto 1fr auto auto;
    column-gap: 8%;
    row-gap: 18px;
    min-height: 0;
    padding: clamp(16px, 1.3vw, 22px);
    border-radius: 24px;
    box-shadow: 0 12px 32px #4b291208;
  }
  .landing-pricing .pricing-note { align-self: center; border-radius: 20px; }
  .landing-pricing .pricing-package-copy h4 { font-size: clamp(20px, 10.5cqw, 34px); letter-spacing: -.045em; }
  .landing-pricing .pricing-extras { grid-template-columns: minmax(0, 1fr); align-content: start; gap: 8px; }
  .landing-pricing .pricing-extra {
    justify-content: flex-start;
    gap: 10px;
    padding: 0;
    background: transparent;
    color: #756d67;
    font-size: clamp(13px, 7cqw, 22px);
    letter-spacing: -.035em;
  }
  .landing-pricing .pricing-extra svg {
    width: 11cqw;
    height: 11cqw;
    flex: 0 0 11cqw;
    padding: 2cqw;
    border-radius: 50%;
    background: var(--package-tint);
    color: var(--package-color);
  }
  .landing-pricing .pricing-total {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
    border-left: 0;
    border-top: 1px solid var(--package-line);
    padding: 18px 0 0;
  }
  .landing-pricing .pricing-total > strong { order: -1; gap: 4px; font-size: clamp(32px, 20cqw, 64px); }
  .landing-pricing .pricing-total strong span { font-size: clamp(14px, 9cqw, 28px); }
  .landing-pricing .pricing-discount-row { gap: 7px; margin-bottom: 0; }
  .landing-pricing .pricing-discount-row del { font-size: clamp(10px, 5.8cqw, 18px); }
  .landing-pricing .pricing-discount-row > span { padding: 6px 8px; border-radius: 14px; font-size: clamp(11px, 6cqw, 19px); }
  .landing-pricing .pricing-unit { justify-self: start; display: flex; gap: 5px; padding: 10px 14px; border-radius: 16px; }
  .landing-pricing .pricing-unit strong, .landing-pricing .pricing-unit > span { font-size: clamp(12px, 6.4cqw, 20px); }
  .landing-pricing .pricing-unit > span { color: var(--package-color); }
  .landing-pricing .pricing-popular {
    top: -18px;
    left: 50%;
    transform: translateX(-50%);
    gap: 7px;
    padding: 9px 18px;
    border-radius: 24px;
    font-size: clamp(12px, 6cqw, 19px);
    white-space: nowrap;
  }
  .landing-pricing .pricing-package .pricing-popular img { width: 18px; height: 18px; }
  .landing-pricing .pricing-benefits { margin-top: 36px; padding: 18px; background: #f8f4f1cc; }
  .landing-pricing .pricing-benefits-head { justify-content: flex-start; padding: 0 12px 18px; }
  .landing-pricing .pricing-benefit-grid { gap: 0; padding: 8px; background: #ffffffb8; border-radius: 20px; }
  .landing-pricing .pricing-benefit:nth-child(n) {
    grid-template-columns: 46px minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    column-gap: 14px;
    justify-items: start;
    padding: 18px 16px;
    border: 0;
    border-radius: 0;
    background: transparent;
    text-align: left;
  }
  .landing-pricing .pricing-benefit:not(:nth-child(4n + 1)) { border-left: 1px solid #eee6e0; }
  .landing-pricing .pricing-benefit:nth-child(n + 5) { border-top: 1px solid #eee6e0; }
  .landing-pricing .pricing-benefit > span { grid-column: 1; grid-row: 1 / 3; align-self: center; margin: 0; }
  .landing-pricing .pricing-benefit h5, .landing-pricing .pricing-benefit p { grid-column: 2; }
  .landing-pricing .pricing-benefit h5 { font-size: 18px; }
  body.intro-page #mobile-landing-screen .pricing-benefit p { font-size: 15px; }
}
@media (min-width: 861px) and (max-width: 1100px) {
  .landing-pricing .pricing-packages { gap: 12px; }
  .landing-pricing .pricing-package { row-gap: 14px; }
  .landing-pricing .pricing-benefit:nth-child(n) { grid-template-columns: 34px minmax(0, 1fr); column-gap: 9px; padding: 14px 10px; }
  .landing-pricing .pricing-benefit > span { width: 34px; height: 34px; font-size: 30px; }
  .landing-pricing .pricing-benefit img, .landing-pricing .pricing-benefit svg { width: 22px; height: 22px; }
  .landing-pricing .pricing-benefit h5 { font-size: 14px; }
  body.intro-page #mobile-landing-screen .pricing-benefit p { font-size: 12px; }
}
@media (min-width: 861px) and (max-width: 1199px) {
  .landing-pricing .pricing-packages { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 16px; }
  .landing-pricing .pricing-benefit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .landing-pricing .pricing-benefit:nth-child(n) { border-left: 0; border-top: 0; }
  .landing-pricing .pricing-benefit:nth-child(even) { border-left: 1px solid #eee6e0; }
  .landing-pricing .pricing-benefit:nth-child(n + 3) { border-top: 1px solid #eee6e0; }
}

.landing-pricing .pricing-benefit > .pricing-humming-icon { color: #e53946; background: #ffe8ec; }

/* The landing purchase action is available only after session restoration. */
.landing-pricing .pricing-cta { width: 100%; border: 0; cursor: pointer; font-family: inherit; }
.landing-pricing .pricing-cta[hidden], #landing-credit-purchase-error[hidden] { display: none !important; }
#landing-credit-purchase-error { color: #b42234; text-align: center; }
#landing-credit-purchase-dialog { width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 0; border: 0; background: transparent; overflow: visible; }
#landing-credit-purchase-dialog::backdrop { background: transparent; }
#landing-credit-purchase-dialog #account-main-grid { display: block; margin: 0; padding: 0; }
#landing-credit-purchase-dialog #account-credit-purchase-status { margin: 0; font-size: 20px; line-height: 1.4; }
#landing-credit-purchase-dialog #account-credit-purchase-status[hidden] { display: none; }
#landing-credit-purchase-dialog #account-credit-purchase-status.field-error { color: #b42234; }
