:root {
    --bg: #07090e;
    --bg-elevated: #0d111a;
    --panel: #111622;
    --panel-border: rgba(255, 255, 255, 0.08);
    --panel-hover: #161c2b;
    --ink: #f0eee6;
    --ink-muted: #9aa3b5;
    --ink-faint: #7c8699;
    --accent: #4eedd5;
    --accent-glow: rgba(78, 237, 213, 0.2);
    --hot: #f6c453;
    --hot-glow: rgba(246, 196, 83, 0.2);
    --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --mono: "SF Mono", ui-monospace, Menlo, Consolas, monospace;
    --serif: Georgia, "Times New Roman", serif;
  }

  * { margin: 0; padding: 0; box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body {
    background: var(--bg);
    color: var(--ink);
    font-family: var(--sans);
    line-height: 1.65;
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
  }

  a { color: var(--accent); text-decoration: none; transition: color 0.15s ease; }
  a:hover { color: #8cf6e4; }

  .wrap { max-width: 1140px; margin: 0 auto; padding: 0 24px; }

  /* Ambient background technical grid */
  .grid-bg {
    position: absolute;
    top: 0; left: 0; right: 0; height: 1100px;
    background-image: 
      radial-gradient(ellipse 60% 40% at 50% -10%, rgba(78, 237, 213, 0.08), transparent 70%),
      linear-gradient(to right, rgba(255, 255, 255, 0.02) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
    background-size: 100% 100%, 64px 64px, 64px 64px;
    pointer-events: none;
    z-index: 0;
  }

  /* Sticky Top Navigation Bar (Mobbin Glassmorphism) */
  nav.navbar {
    position: sticky;
    top: 0;
    z-index: 100;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    background: rgba(7, 9, 14, 0.75);
    border-bottom: 1px solid var(--panel-border);
    padding: 14px 0;
  }
  .nav-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .brand {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: var(--mono);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--ink);
  }
  .brand-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(78, 237, 213, 0.1);
    color: var(--accent);
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 11px;
    border: 1px solid rgba(78, 237, 213, 0.25);
  }
  .pulse-dot {
    width: 6px; height: 6px; border-radius: 50%; background: var(--accent);
    box-shadow: 0 0 8px var(--accent);
  }
  .nav-links {
    display: flex;
    align-items: center;
    gap: 22px;
    font-size: 13.5px;
    font-family: var(--mono);
  }
  .nav-links a { color: var(--ink-muted); }
  .nav-links a:hover { color: var(--ink); }
  .nav-cta {
    background: var(--accent);
    color: #071f1a !important;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: 6px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
  }
  .nav-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 16px var(--accent-glow);
  }

  /* Hero Section */
  header.hero {
    position: relative;
    padding: 72px 0 64px;
    z-index: 1;
  }
  .hero-grid {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 56px;
    align-items: center;
  }
  @media (max-width: 900px) {
    .hero-grid { grid-template-columns: 1fr; gap: 44px; }
  }

  .kicker-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(78, 237, 213, 0.08);
    border: 1px solid rgba(78, 237, 213, 0.2);
    color: var(--accent);
    font-family: var(--mono);
    font-size: 11.5px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 5px 12px;
    border-radius: 999px;
    margin-bottom: 22px;
  }
  h1.hero-title {
    font-size: clamp(40px, 5.2vw, 68px);
    line-height: 1.05;
    letter-spacing: -0.03em;
    font-weight: 800;
    color: #ffffff;
  }
  h1.hero-title span.dim { color: var(--ink-muted); font-weight: 400; }
  p.hero-sub {
    margin-top: 22px;
    font-size: clamp(16.5px, 1.9vw, 19px);
    color: var(--ink-muted);
    line-height: 1.65;
    max-width: 580px;
  }
  p.hero-sub strong { color: var(--ink); }
  p.hero-sub .hero-sub-roi {
    display: block;
    margin-top: 14px;
    color: #e2e8f0;
    font-size: 0.95em;
  }

  .hero-ledger {
    margin-top: 28px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-family: var(--mono);
    font-size: 12px;
  }
  .ledger-chip {
    background: var(--bg-elevated);
    border: 1px solid var(--panel-border);
    padding: 6px 12px;
    border-radius: 6px;
    color: var(--ink-muted);
  }
  .ledger-chip.hot {
    background: rgba(246, 196, 83, 0.08);
    border-color: rgba(246, 196, 83, 0.3);
    color: var(--hot);
    font-weight: 700;
  }

  .hero-proof-strip {
    margin-top: 20px;
    background: var(--panel);
    border: 1px solid var(--panel-border);
    border-radius: 8px;
    padding: 12px 16px;
    font-family: var(--mono);
    font-size: 12px;
    line-height: 1.6;
    color: var(--ink-muted);
  }
  .strip-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 6px;
  }
  .strip-tag {
    color: var(--accent);
    font-weight: 700;
    letter-spacing: 0.08em;
    font-size: 11px;
  }
  .strip-meta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .hero-proof-strip code {
    background: var(--bg-elevated);
    border: 1px solid var(--panel-border);
    padding: 1px 6px;
    border-radius: 4px;
    color: var(--ink);
    font-size: 11px;
    white-space: nowrap;
  }
  .strip-body {
    margin-top: 6px;
    font-size: 11.5px;
    line-height: 1.6;
  }
  .strip-body em {
    color: #cbd5e1;
    font-style: normal;
  }
  .strip-link {
    color: var(--hot);
    text-decoration: none;
    font-weight: 700;
    white-space: nowrap;
    margin-left: 6px;
    display: inline-block;
    transition: color 0.15s ease;
    /* 44px WCAG / Apple HIG touch target for inline hero proof-strip link
       (was 17px high, AGX QA F-03 fix). */
    min-height: 44px;
    padding: 12px 0 10px;
  }
  .strip-link:hover {
    color: #ffd875;
    text-decoration: underline;
  }

  @media (max-width: 640px) {
    .hero-proof-strip {
      padding: 10px 14px;
      font-size: 11px;
      margin-top: 16px;
      margin-bottom: 20px;
    }
    .strip-head {
      flex-direction: column;
      align-items: flex-start;
      gap: 4px;
      margin-bottom: 6px;
    }
    .strip-body {
      margin-top: 4px;
      line-height: 1.5;
    }
    .strip-body em {
      display: inline;
    }
    .strip-link {
      display: inline-block;
      margin-top: 4px;
      margin-left: 0;
    }
  }

  .cta-group {
    margin-top: 24px;
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    align-items: center;
  }
  .btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 26px;
    border-radius: 8px;
    font-family: var(--mono);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: pointer;
  }
  .btn-primary {
    background: var(--accent);
    color: #061e19 !important;
    box-shadow: 0 4px 20px var(--accent-glow);
  }
  .btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px var(--accent-glow);
    background: #6ef4df;
  }
  .btn-secondary {
    background: var(--panel);
    border: 1px solid var(--panel-border);
    color: var(--ink);
  }
  .btn-secondary:hover {
    background: var(--panel-hover);
    border-color: rgba(255, 255, 255, 0.2);
    color: #fff;
    transform: translateY(-1px);
  }
  .micro-trust {
    margin-top: 14px;
    font-family: var(--mono);
    font-size: 12px;
    color: var(--ink-faint);
  }

  /* 3D Realistic Hardcover Book Component (Mobbin showpiece) */
  .book-stage {
    display: flex;
    justify-content: center;
    align-items: center;
    perspective: 1400px;
    padding: 30px 10px;
    aspect-ratio: 2 / 3;
  }
  .book-3d {
    position: relative;
    width: 320px;
    height: 480px;
    aspect-ratio: 2 / 3;
    transform-style: preserve-3d;
    transform: rotateY(-18deg) rotateX(6deg);
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 
      -25px 25px 50px rgba(0, 0, 0, 0.8),
      0 0 80px rgba(78, 237, 213, 0.12);
    cursor: pointer;
    border-radius: 3px 12px 12px 3px;
  }
  .book-3d:hover {
    transform: rotateY(-8deg) rotateX(2deg) scale(1.03);
    box-shadow: 
      -30px 30px 65px rgba(0, 0, 0, 0.85),
      0 0 100px rgba(78, 237, 213, 0.2);
  }
  .book-front {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 3px 12px 12px 3px;
    overflow: hidden;
    background: #090c13;
  }
  .book-front picture {
    display: block;
    width: 100%;
    height: 100%;
  }
  .book-front img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    aspect-ratio: 2 / 3;
  }
  /* Realistic spine crease reflection */
  .book-front::before {
    content: "";
    position: absolute;
    top: 0; left: 0; bottom: 0; width: 40px;
    background: linear-gradient(to right, 
      rgba(255,255,255,0.12) 0%, 
      rgba(0,0,0,0.4) 15%, 
      rgba(255,255,255,0.08) 25%, 
      transparent 100%);
    pointer-events: none;
    z-index: 2;
  }
  /* Glossy diagonal sheen */
  .book-front::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, transparent 50%, rgba(0,0,0,0.3) 100%);
    pointer-events: none;
    z-index: 3;
  }
  /* Realistic page stack edges on right */
  .book-pages-stack {
    position: absolute;
    top: 6px; bottom: 6px; right: -18px; width: 18px;
    background: repeating-linear-gradient(to right, #e2dfd5 0px, #c8c5ba 1px, #f2efe6 2px);
    transform: rotateY(90deg);
    transform-origin: left;
    border-radius: 0 4px 4px 0;
    box-shadow: inset 0 0 6px rgba(0,0,0,0.4);
  }

  /* Mobile hero — overrides base hero/book-stage rules above so they win by source order.
     Originally at the top of this stylesheet (t_e982a4aa via 542b9e6), but the inline->external
     CSS extraction in ab1ccd7 (W2 CSP packet) reordered the file, re-introducing the same
     cascade bug 542b9e6 had fixed: equal-specificity media rules BEFORE base rules lose to
     the base rules on mobile. Re-moved here after the book-stack block (Sol/Astra review,
     t_c943e9cf). Late-block placement matches 542b9e6's accepted state. Density tuning
     preserved from 542b9e6: hero vertical padding 14/12 (was 28/24), proof-strip
     margin-top 12 / margin-bottom 8 (was 16/20 in the strip-link-only media block above),
     cta-group margin-top 6 / gap 8 (was 14/10). Net effect: buy CTA above the 667px fold
     on iPhone SE (375x667) without touching copy, links, or assets. Preserved from
     ab1ccd7/t_7c2a423d: nav-cta 44px WCAG/Apple HIG touch-target height. */
  @media (max-width: 640px) {
    nav.navbar { padding: 10px 0; }
    .nav-inner { justify-content: space-between; }
    .brand-badge { display: none; } /* Hide secondary badge on small mobile */
    .nav-links a:not(.nav-cta) { display: none; } /* Hide non-essential nav links */
    /* Buy CTA must hit 44px WCAG / Apple HIG touch-target height on mobile
       (was 32px — strip-link + nav-cta audit fix, AGX QA t_7c2a423d). */
    .nav-cta { padding: 11px 16px; font-size: 12.5px; min-height: 44px; display: inline-flex; align-items: center; }
    .cta-group { flex-direction: column; width: 100%; gap: 8px; margin-top: 6px; }
    .cta-group .btn { width: 100%; text-align: center; min-height: 48px; padding: 14px 20px; }
    .wrap { padding: 0 16px; max-width: 100%; }
    .waitlist-form { flex-direction: column; }
    .waitlist-form .btn { width: 100%; text-align: center; }
    /* Compact the hero so the buy + sample CTAs sit above the 667px fold on
       iPhone SE without scrolling (was 162-230px below the fold, AGX QA F-02).
       Padding tuned post-source-order fix to actually fit on 375x667. */
    header.hero { padding: 14px 0 12px; }
    .kicker-pill { margin-bottom: 12px; font-size: 10.5px; padding: 4px 10px; }
    h1.hero-title { font-size: clamp(30px, 9vw, 42px); }
    p.hero-sub { margin-top: 12px; font-size: 15px; line-height: 1.55; }
    p.hero-sub .hero-sub-roi { margin-top: 8px; font-size: 14px; }
    .hero-ledger { margin-top: 14px; gap: 6px; font-size: 11px; }
    .ledger-chip { padding: 4px 9px; }
    .hero-proof-strip { margin-top: 12px; margin-bottom: 8px; padding: 10px 12px; font-size: 11px; }
    .micro-trust { margin-top: 10px; font-size: 11.5px; }
    .hero-grid { gap: 28px; }
    .book-stage { padding: 16px 10px; }
  }

  /* Global Section Styles */
  section {
    padding: 72px 0;
    border-bottom: 1px solid var(--panel-border);
    position: relative;
    z-index: 1;
  }
  .section-header {
    margin-bottom: 36px;
  }
  .section-tag {
    font-family: var(--mono);
    font-size: 11.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 8px;
    display: block;
  }
  h2.section-title {
    font-size: clamp(26px, 3.4vw, 38px);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #fff;
  }
  p.section-desc {
    margin-top: 10px;
    color: var(--ink-muted);
    font-size: 17px;
    max-width: 660px;
  }

  /* Interactive Receipt Terminal (Mobbin segmented control) */
  .terminal-box {
    background: var(--bg-elevated);
    border: 1px solid var(--panel-border);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(0,0,0,0.5);
  }
  .terminal-nav {
    display: flex;
    background: rgba(0, 0, 0, 0.4);
    border-bottom: 1px solid var(--panel-border);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
    padding: 6px 12px;
    gap: 6px;
  }
  .terminal-tab {
    background: transparent;
    border: 1px solid transparent;
    color: var(--ink-muted);
    font-family: var(--mono);
    font-size: 12px;
    padding: 8px 14px;
    border-radius: 6px;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.15s ease;
    /* 44px WCAG / Apple HIG touch target on coarse pointers (AGX QA F-03 fix). */
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
  .terminal-tab:hover {
    color: var(--ink);
    background: rgba(255, 255, 255, 0.04);
  }
  .terminal-tab.active {
    color: var(--accent);
    background: rgba(78, 237, 213, 0.1);
    border-color: rgba(78, 237, 213, 0.3);
    font-weight: 700;
  }
  .terminal-body {
    padding: 24px;
    font-family: var(--mono);
    font-size: 13.5px;
    line-height: 1.7;
    color: #d1d7e0;
    min-height: 240px;
    background: #090c13;
    overflow-x: auto;
  }
  .terminal-meta {
    display: flex;
    justify-content: space-between;
    padding: 12px 24px;
    background: rgba(0,0,0,0.2);
    border-top: 1px solid var(--panel-border);
    font-family: var(--mono);
    font-size: 11.5px;
    color: var(--ink-faint);
  }

  /* The Receipts Grid */
  .receipts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
    margin-top: 24px;
  }
  .receipt-card {
    background: var(--panel);
    border: 1px solid var(--panel-border);
    border-radius: 10px;
    padding: 24px;
    transition: transform 0.2s ease, border-color 0.2s ease;
  }
  .receipt-card:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 255, 255, 0.18);
  }
  .rc-num {
    font-family: var(--mono);
    font-size: 32px;
    font-weight: 800;
    color: #fff;
    line-height: 1;
    margin-bottom: 8px;
  }
  .rc-num.hot { color: var(--hot); }
  .rc-label {
    font-size: 14px;
    color: var(--ink-muted);
    line-height: 1.5;
  }

  /* Comparison Cards */
  .thesis-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }
  @media (max-width: 768px) {
    .thesis-grid { grid-template-columns: 1fr; }
  }
  .thesis-card {
    background: var(--panel);
    border: 1px solid var(--panel-border);
    border-radius: 10px;
    padding: 30px;
  }
  .thesis-card.truth {
    border-color: rgba(78, 237, 213, 0.3);
    background: linear-gradient(180deg, rgba(78, 237, 213, 0.04) 0%, var(--panel) 100%);
  }
  .thesis-card h3 {
    font-family: var(--mono);
    font-size: 13px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 14px;
  }
  .thesis-card.illusion h3 { color: #f87171; }
  .thesis-card.truth h3 { color: var(--accent); }
  .thesis-card ul {
    list-style: none;
    font-size: 15px;
    color: var(--ink-muted);
  }
  .thesis-card li {
    margin-bottom: 12px;
    display: flex;
    gap: 10px;
    line-height: 1.5;
  }
  .thesis-card li::before {
    content: "—";
    color: var(--ink-faint);
  }

  /* Chapter Roadmap (Accordion Deck) */
  .parts-grid {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .part-item {
    background: var(--panel);
    border: 1px solid var(--panel-border);
    border-radius: 10px;
    padding: 22px 28px;
    transition: all 0.2s ease;
  }
  .part-item:hover {
    border-color: rgba(78, 237, 213, 0.3);
    background: var(--panel-hover);
  }
  .part-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
  }
  .part-tag {
    font-family: var(--mono);
    font-size: 11.5px;
    color: var(--accent);
    letter-spacing: 0.1em;
    font-weight: 700;
  }
  .part-count {
    font-family: var(--mono);
    font-size: 12px;
    color: var(--ink-faint);
  }
  .part-title {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 6px;
  }
  .part-summary {
    color: var(--ink-muted);
    font-size: 14.5px;
    line-height: 1.6;
  }

  /* Sample Excerpt Callout */
  .sample-box {
    background: var(--bg-elevated);
    border: 1px solid var(--panel-border);
    border-left: 4px solid var(--accent);
    border-radius: 0 10px 10px 0;
    padding: 36px 32px;
    font-family: var(--serif);
    font-size: 18.5px;
    line-height: 1.75;
    color: #e5e2d8;
  }
  .sample-box p + p { margin-top: 18px; }
  .sample-box em { color: #fff; font-style: italic; }
  .sample-meta {
    margin-top: 24px;
    font-family: var(--mono);
    font-size: 13px;
    color: var(--ink-muted);
  }

  /* Pricing / Checkout Card */
  #buy, #join, #pricing {
    scroll-margin-top: 80px;
  }
  .pricing-deck {
    background: linear-gradient(180deg, var(--bg-elevated) 0%, var(--panel) 100%);
    border: 1px solid var(--panel-border);
    border-radius: 16px;
    padding: 48px;
    text-align: center;
    max-width: 680px;
    margin: 0 auto;
    overflow-x: hidden;
  }
  @media (max-width: 800px) {
    .pricing-deck { padding: 36px 24px; }
  }
  @media (max-width: 640px) {
    .pricing-deck { padding: 28px 16px; }
  }
  .pricing-price {
    font-family: var(--mono);
    font-size: 56px;
    font-weight: 800;
    color: var(--hot);
    line-height: 1;
    margin: 16px 0 12px;
  }
  .pricing-then {
    font-size: 22px;
    color: var(--ink-muted);
    font-weight: 400;
  }
  .pricing-tier {
    font-family: var(--mono);
    font-size: 12px;
    color: var(--accent);
    text-transform: uppercase;
    letter-spacing: 0.12em;
  }

  /* Secondary Dispatch Fallback */
  .dispatch-fallback {
    text-align: center;
    margin-top: 40px;
  }
  .dispatch-fallback p {
    color: var(--ink-faint);
    font-size: 13.5px;
    font-family: var(--mono);
  }
  .dispatch-fallback a {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  #dispatch-tray {
    display: none;
    margin-top: 16px;
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
  }
  #dispatch-tray:target {
    display: block !important;
  }

  /* Waitlist Form */
  .waitlist-form {
    display: flex;
    gap: 10px;
    margin-top: 16px;
  }
  @media (max-width: 640px) {
    .waitlist-form {
      flex-direction: column;
    }
    .waitlist-form .btn {
      width: 100%;
      text-align: center;
    }
  }
  .waitlist-form input {
    flex: 1;
    background: rgba(0, 0, 0, 0.4);
    border: 1px solid var(--panel-border);
    border-radius: 6px;
    padding: 12px 16px;
    font-family: var(--mono);
    font-size: 13.5px;
    color: #fff;
  }
  .waitlist-form input:focus {
    outline: none;
    border-color: var(--accent);
  }
  .waitlist-form .cf-turnstile {
    flex: 1 1 100%;
  }

  /* Footer */
  footer {
    padding: 56px 0;
    color: var(--ink-faint);
    font-family: var(--mono);
    font-size: 12.5px;
    line-height: 1.8;
  }



/* 44px WCAG / Apple HIG touch targets for footer navigation + inline pricing-deck
   links (was 20-23px high, AGX QA F-03 fix). */
.footer-links a,
.pricing-deck a[href^="/"],
.pricing-deck a[href^="https://johnwhitman.ai"],
.pricing-deck a[href^="mailto:"] {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 4px;
}
.sample-meta a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 0;
}

/* W2 book-M1 bis (2026-10-09) — extracted from inline style="..." attrs on
   index.html to satisfy sitewide strict CSP (no unsafe-inline). The classes
   below map 1:1 onto previously inlined declarations. */
.part-item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.sample-meta-link{color:var(--accent);font-weight:700}
.pricing-blurb{color:var(--ink-muted);font-size:15px;line-height:1.6;max-width:520px;margin:0 auto 24px}
.pricing-buy-btn{display:inline-block;padding:16px 36px;font-size:16px}
.pricing-micro-trust{margin-top:18px;font-family:var(--mono);font-size:12.5px;color:var(--ink-muted)}
.pricing-related{margin-top:20px;font-size:13px;color:var(--ink-muted);line-height:1.7}
.accent-link{color:var(--accent)}
.dispatch-card-head{font-size:15px;color:#fff;margin-bottom:6px}
.dispatch-card-copy{color:var(--ink-muted);font-size:13px;line-height:1.5;margin-bottom:12px}
.signup-msg{display:block;font-family:var(--mono);font-size:12px;color:var(--accent);margin-top:8px}
.footer-wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;align-items:center}
.footer-nav{display:flex;gap:18px;flex-wrap:wrap}