/* ------------------------------------------------------------------
     Built for the audience this product actually has: mineral owners,
     skewing older, mostly on a phone, and by disposition suspicious of
     unsolicited mineral contact.

     That drives every choice here. Type starts at 18px and never goes
     below 16. Contrast is well past AA. There is no JavaScript, no
     popup, no cookie banner, no tracker and no external request of any
     kind -- the page cannot phone anywhere, which is the honest version
     of a privacy claim. Serif headings because this should read as a
     professional service and not as a startup.
     ------------------------------------------------------------------ */
  :root {
    --ink:      #1a1a17;
    --ink-soft: #4a4a44;
    --paper:    #faf8f4;
    --card:     #ffffff;
    --rule:     #e2ddd3;
    --green:    #14532d;
    --green-lo: #f0f5f1;
    --accent:   #8a6a2f;
  }
  @media (prefers-color-scheme: dark) {
    :root {
      --ink:      #eceae5;
      --ink-soft: #a8a49c;
      --paper:    #16161a;
      --card:     #1e1e23;
      --rule:     #33333a;
      --green:    #7fc79c;
      --green-lo: #1b2620;
      --accent:   #cfae6d;
    }
  }
  * { box-sizing: border-box; }
  html { -webkit-text-size-adjust: 100%; }
  body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font: 18px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
          "Helvetica Neue", Arial, sans-serif;
  }
  h1, h2, h3 {
    font-family: Georgia, "Iowan Old Style", "Times New Roman", serif;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.01em;
  }
  .wrap { max-width: 46rem; margin: 0 auto; padding: 0 1.25rem; }

  /* ---- top bar ---- */
  .top {
    border-bottom: 1px solid var(--rule);
    background: var(--card);
  }
  .top .wrap {
    display: flex; align-items: center; justify-content: space-between;
    gap: 1rem; padding-top: 1rem; padding-bottom: 1rem;
  }
  .mark {
    display: inline-flex; align-items: center; gap: 0.55rem;
    font-family: Georgia, serif; font-size: 1.35rem; font-weight: 600;
    color: var(--ink); text-decoration: none; letter-spacing: -0.02em;
  }
  .mark span { color: var(--green); }
  .markicon { width: 1.35rem; height: 1.35rem; flex: none; }

  /* ---- buttons ---- */
  .btn {
    display: inline-block; padding: 0.7rem 1.25rem; border-radius: 6px;
    font-size: 1rem; font-weight: 600; text-decoration: none;
    border: 1px solid var(--green); transition: opacity .15s;
  }
  .btn:hover { opacity: 0.85; }
  .btn-p { background: var(--green); color: var(--paper); }
  .btn-s { background: transparent; color: var(--green); }
  @media (prefers-color-scheme: dark) { .btn-p { color: #10241a; } }

  /* ---- hero ---- */
  .hero { padding: 4rem 0 3rem; }
  .hero h1 { font-size: clamp(2rem, 6.5vw, 3rem); margin: 0 0 1.25rem; }
  .hero p {
    font-size: 1.2rem; color: var(--ink-soft); margin: 0 0 2rem;
    max-width: 34rem;
  }

  /* ---- generic section ---- */
  section { padding: 3rem 0; border-top: 1px solid var(--rule); }
  section h2 {
    font-size: 1.6rem; margin: 0 0 1rem;
  }
  .eyebrow {
    font-size: 0.8rem; font-weight: 700; letter-spacing: 0.09em;
    text-transform: uppercase; color: var(--accent); margin: 0 0 0.6rem;
  }
  .lead { font-size: 1.1rem; }
  p { margin: 0 0 1rem; }
  p:last-child { margin-bottom: 0; }

  /* ---- the free tool ---- */
  .tool {
    background: var(--green-lo);
    border: 1px solid var(--rule);
    border-radius: 10px;
    padding: 2rem 1.75rem;
  }
  .tool h2 { margin-top: 0; }
  .scope {
    margin-top: 1.5rem; padding-top: 1.25rem;
    border-top: 1px solid var(--rule);
    font-size: 1rem; color: var(--ink-soft);
  }
  .scope strong { color: var(--ink); }

  /* ---- services ---- */
  .svc { padding: 1.75rem 0; border-top: 1px solid var(--rule); }
  .svc:first-of-type { border-top: none; padding-top: 0.5rem; }
  .svc h3 { font-size: 1.3rem; margin: 0 0 0.75rem; color: var(--green); }

  /* ---- footer ---- */
  footer {
    border-top: 1px solid var(--rule);
    background: var(--card);
    padding: 2.5rem 0;
    font-size: 0.95rem; color: var(--ink-soft);
  }
  footer p { margin: 0 0 0.75rem; }

  a { color: var(--green); }
  :focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }

  /* ---- long-form pages (privacy, terms) ---------------------------------
     Added when the site went from one page to three. The CSS lives in one
     file for the same reason the reviewer's rules live in one function: three
     copies of a stylesheet is three copies that drift, and the drift is
     invisible until somebody notices the footer is a different grey on one
     page. Same-origin, so it costs nothing the inline version did not.
     --------------------------------------------------------------------- */
  .doc { padding: 3rem 0 4rem; }
  .doc h1 { font-size: clamp(1.8rem, 5vw, 2.4rem); margin: 0 0 0.5rem; }
  .doc .updated { color: var(--ink-soft); font-size: 0.95rem; margin-bottom: 2.5rem; }
  .doc h2 {
    font-size: 1.35rem; margin: 2.5rem 0 0.75rem;
    padding-top: 1.5rem; border-top: 1px solid var(--rule);
  }
  .doc h2:first-of-type { border-top: none; padding-top: 0; margin-top: 2rem; }
  .doc h3 { font-size: 1.1rem; margin: 1.75rem 0 0.5rem; }
  .doc ul { padding-left: 1.3rem; margin: 0 0 1rem; }
  .doc li { margin-bottom: 0.5rem; }
  .doc .callout {
    background: var(--green-lo); border: 1px solid var(--rule);
    border-radius: 8px; padding: 1.25rem 1.4rem; margin: 1.5rem 0;
  }
  .doc .callout p:last-child { margin-bottom: 0; }
  .fill {
    background: #fff3cd; color: #664d03; padding: 0.05em 0.35em;
    border-radius: 3px; font-weight: 600;
  }
  @media (prefers-color-scheme: dark) {
    .fill { background: #4a3d10; color: #ffe69c; }
  }
  .backlink { display: inline-block; margin-bottom: 1.5rem; font-size: 0.95rem; }