/* Download and legal: the pricing hero's lattice glow over a centred block, and a reading column. */
.top { position: relative; isolation: isolate; text-align: center; padding-block: 72px 24px; display: grid; justify-items: center; gap: 18px; }
.top::before { content: ""; position: absolute; inset: -40px -10vw 0; z-index: -1;
  background: radial-gradient(60% 70% at 50% 0%, color-mix(in srgb, var(--brand-fill) 16%, transparent), transparent 70%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='62.354' height='108'%3E%3Cg fill='none' stroke='%23ffb348' stroke-opacity='.07'%3E%3Cpath d='M31.18 2L60.6 19v34L31.18 70 1.74 53V19z'/%3E%3Cpath d='M0 56L29.44 73v34L0 124M62.35 56L32.9 73v34l29.45 17'/%3E%3C/g%3E%3C/svg%3E");
  -webkit-mask-image: radial-gradient(70% 90% at 50% 0%, #000 40%, transparent 100%); mask-image: radial-gradient(70% 90% at 50% 0%, #000 40%, transparent 100%); }
.top h1 { font-size: clamp(36px, 5vw, 60px); max-width: 18ch; }
.top .lede { margin-inline: auto; }
.top .ctas { justify-content: center; margin-top: 8px; }
.doc { max-width: 72ch; margin: 64px auto 0; }
.doc h1 { font-size: clamp(32px, 4vw, 44px); margin-bottom: 24px; }
.doc h2 { font-size: 22px; letter-spacing: -.02em; margin: 32px 0 10px; }
.doc p, .doc li { color: var(--muted); }
.doc p + p { margin-top: 12px; }
.doc ul, .doc ol { padding-left: 20px; display: grid; gap: 6px; margin: 12px 0; }
.doc a { color: var(--brand); }