/* Additions for the pages the design did not cover: waitlist, pricing, legal, 404, footer legal block.
   Uses only the theme tokens (--lg-*, --sans, --display, --mono) from theme-lgt.css / site.css. */

/* ---- waitlist form (Reportsmade, coming later) */
.waitlist { margin-top: 26px; max-width: 460px; }
.waitlist__title { font: 600 15px/1.3 var(--sans); margin-bottom: 10px; }
.waitlist__row { display: flex; gap: 8px; flex-wrap: wrap; }
.waitlist__input { flex: 1 1 200px; min-width: 0; height: 46px; padding: 0 18px; border-radius: 999px; border: 1.5px solid currentColor; background: var(--lg-card); color: var(--lg-ink); font: 500 16px/1 var(--sans); }
.waitlist__input::placeholder { color: var(--lg-stone); }
.waitlist__btn { flex: 0 0 auto; }
.waitlist__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.waitlist__note { margin-top: 10px; font: 400 13px/1.5 var(--mono); opacity: .9; }
.waitlist[data-state="done"] .waitlist__row { display: none; }
.waitlist[data-state="done"] .waitlist__note { font: 600 16px/1.4 var(--sans); }
.waitlist[data-state="error"] .waitlist__note { color: var(--lg-butter); }
.waitlist--page { max-width: 520px; }
.waitlist--page .waitlist__input { border-color: var(--lg-ink); }
.waitlist--page[data-state="error"] .waitlist__note { color: var(--lg-blaze); }
.waitlist :focus-visible { outline: 3px solid var(--lg-butter); outline-offset: 2px; }
.waitlist--page :focus-visible { outline-color: var(--lg-blaze); }

/* ---- footer legal block */
.foot__legal { grid-column: 1 / -1; border-top: 1px solid var(--lg-night); padding-top: 22px; display: grid; gap: 14px; }
.foot__legal nav { display: flex; flex-wrap: wrap; gap: 6px 22px; }
.foot .foot__legal nav a { display: inline; padding: 4px 0; border: 0; font: 500 14px/1.4 var(--sans); }
.foot__company { font: 400 13px/1.65 var(--mono); color: var(--lg-line); max-width: 78ch; }
.foot__company a { color: var(--lg-paper); }

/* ---- document pages (legal, pricing, 404) */
.doc { padding: clamp(32px, 5vw, 72px) 0 clamp(64px, 9vw, 120px); }
.doc__in { max-width: 760px; margin-inline: auto; padding-inline: var(--gut); }
.doc__eyebrow { font: 500 13px/1.3 var(--mono); color: var(--lg-stone); letter-spacing: .02em; }
.doc h1 { font: 760 clamp(40px, 6vw, 76px)/.98 var(--display); font-variation-settings: "opsz" 96, "wdth" 100; letter-spacing: -.035em; text-wrap: balance; margin: 14px 0 12px; }
.doc__lede { font: 450 19px/1.5 var(--sans); max-width: 60ch; }
.doc__updated { margin-top: 14px; font: 400 13px/1.5 var(--mono); color: var(--lg-stone); }
.doc :where(h2) { font: 700 26px/1.15 var(--display); font-variation-settings: "opsz" 48, "wdth" 100; letter-spacing: -.02em; margin: 44px 0 10px; }
.doc :where(p, li) { font: 400 17px/1.65 var(--sans); }
.doc :where(p + p, ul + p, p + ul) { margin-top: 12px; }
.doc :where(ul) { padding-left: 1.2em; list-style: disc; display: grid; gap: 6px; }
.doc :where(a:not(.btn)) { text-decoration: underline; text-underline-offset: 3px; }
.doc :where(a:not(.btn)):hover { color: var(--lg-cobalt); }
.doc :focus-visible { outline: 3px solid var(--lg-cobalt); outline-offset: 3px; }
.doc__draft { margin-top: 22px; padding: 12px 16px; border-radius: 12px; background: var(--lg-butter); color: var(--lg-ink); font: 600 15px/1.45 var(--sans); }
.doc--wide .doc__in { max-width: var(--max); }
.doc--404 { text-align: left; }
.doc--404 .btn { margin-top: 28px; }

/* ---- pricing */
.pricing__note { margin-top: 22px; padding: 14px 18px; border-radius: 14px; background: var(--lg-butter); color: var(--lg-ink); font: 600 16px/1.45 var(--sans); max-width: 62ch; }
.pricing__wallet { margin-top: 22px; font: 500 18px/1.5 var(--sans); max-width: 62ch; }
.plans { margin-top: 36px; display: grid; grid-template-columns: repeat(2, minmax(0, 440px)); gap: 16px; }
.plan { display: flex; flex-direction: column; background: var(--lg-card); border: 1.5px solid var(--lg-ink); border-radius: 22px; padding: 28px 26px 26px; }
.plan[data-featured="true"] { background: var(--lg-ink); color: var(--lg-paper); }
.plan__name { font: 700 24px/1 var(--display); font-variation-settings: "opsz" 48, "wdth" 100; letter-spacing: -.02em; }
.plan__tag { margin-top: 8px; font: 400 14px/1.45 var(--sans); color: var(--lg-stone); min-height: 2.9em; }
.plan[data-featured="true"] .plan__tag { color: var(--lg-line); }
.plan__price { margin-top: 18px; font: 760 52px/1 var(--display); font-variation-settings: "opsz" 96, "wdth" 100; letter-spacing: -.035em; }
.plan__price small { font: 500 15px/1 var(--sans); letter-spacing: 0; color: var(--lg-stone); }
.plan[data-featured="true"] .plan__price small { color: var(--lg-line); }
.plan__alt { margin-top: 6px; font: 400 14px/1.4 var(--mono); color: var(--lg-stone); min-height: 1.4em; }
.plan[data-featured="true"] .plan__alt { color: var(--lg-line); }
.plan__list { margin-top: 20px; display: grid; gap: 10px; flex: 1; align-content: start; }
.plan__list li { display: grid; grid-template-columns: 22px 1fr; gap: 10px; font: 450 16px/1.45 var(--sans); }
.plan__list li::before { content: ""; width: 18px; height: 18px; margin-top: 2px; border-radius: 50%; background: var(--lg-cobalt) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M5.5 10.4l3 3 6-6.4' fill='none' stroke='%23F3EEE4' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center / 100% no-repeat; }
.plan[data-featured="true"] .plan__list li::before { background-color: var(--lg-blaze); }
.plan .btn { margin-top: 26px; width: 100%; }
.plan .btn--outline { background: transparent; color: inherit; box-shadow: inset 0 0 0 1.5px currentColor; }
.plan .btn--outline:hover { background: var(--lg-ink); color: var(--lg-paper); }
.topups { margin-top: 16px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; background: var(--lg-card); border: 1.5px dashed var(--lg-ink); border-radius: 22px; padding: 22px 26px; }
.topups__name { font: 700 20px/1.2 var(--display); font-variation-settings: "opsz" 48, "wdth" 100; }
.topups__text { margin-top: 4px; font: 400 15px/1.5 var(--sans); color: var(--lg-stone); }
.topups .btn { margin: 0; }
.pricing__foot { margin-top: 30px; font: 400 14px/1.6 var(--mono); color: var(--lg-stone); max-width: 80ch; }
.pricing__soon { margin-top: 44px; padding-top: 28px; border-top: 1.5px solid var(--lg-ink); }
.pricing__soon h2 { margin-top: 0; }
@media (max-width: 899px) { .plans { grid-template-columns: 1fr; } .plan__tag { min-height: 0; } .plan__alt { min-height: 0; } }
@media (max-width: 560px) { .doc :where(p, li) { font-size: 16px; } .plan__price { font-size: 46px; } }

/* ---- phone: the hero chart card (fix 2b) lives in sections.css/variants.css overrides below */
.plan__name, .topups__name { margin: 0; }
.plan .btn { text-decoration: none; }
.plan .btn + .btn { margin-top: 10px; }
.plan__list { padding-left: 0; list-style: none; }