/* ═══════════════════════════════════════════════════════════════════════
   THE POLICY DOCUMENT'S STYLES — LOADED BY BOTH PAGES.

   /recommendation-policy renders #policy-doc directly. The landing page's
   sheet FETCHES #policy-doc out of that page and drops it into .sheet-bd.
   Same markup, two parents — so every selector here hangs off #policy-doc,
   which travels with the element, rather than off `article` or `.sheet-bd`,
   which do not.

   THIS FILE EXISTS BECAUSE THE ALTERNATIVE DRIFTED. index.html used to carry
   its own .sheet-bd copy of these rules, and the moment the policy grew a
   contents list the sheet rendered it as "1. 01Status and scope" while the
   standalone page looked correct. One copy, both pages.

   Sits at the SITE ROOT, next to the landing page's index.html — both pages
   ask for it as /policy.css, so one copy serves the root page and the page
   inside /recommendation-policy/.

   TYPE IS SET SMALLER THAN THE REST OF THE SITE, ON PURPOSE. This reads as a
   terms page rather than as marketing: 13.5px body against the landing page's
   15-16px, tighter section spacing, and headings stepped down to match. 13.5px
   is the floor — below that it stops being legible on a phone, and a policy
   nobody can read is worse than no policy. The measure is in ch so it tracks
   the type size: shrink the font and the column narrows with it, which keeps
   the line length right rather than stretching it to 100 characters.

   Colors fall back to literals so this file does not depend on either page's
   token names.
   ═══════════════════════════════════════════════════════════════════════ */

/* padding only on the standalone page; inside the sheet, .sheet-bd supplies it */
.wrap>#policy-doc{padding:42px 0 56px}
@media(max-width:640px){ .wrap>#policy-doc{padding:28px 0 40px} }

#policy-doc>*{max-width:70ch}
#policy-doc .eyebrow{font-size:10.5px;letter-spacing:.18em}
#policy-doc h1{font-size:clamp(23px,3.2vw,29px);margin-top:8px;line-height:1.15}
#policy-doc h2{font-size:clamp(16px,1.9vw,18px);margin-top:7px;line-height:1.28}
#policy-doc p{color:var(--slate-d,#5A636E);font-size:13.5px;margin-top:9px;line-height:1.6}
#policy-doc ul{color:var(--slate-d,#5A636E);font-size:13.5px;margin:9px 0 0;padding-left:17px;
  line-height:1.6}
#policy-doc li{margin-top:7px}
#policy-doc strong{color:var(--ink,#101A24);font-weight:600}
#policy-doc a{color:var(--signal,#0E6E52);text-decoration:underline;text-underline-offset:2px}

/* effective date, directly under the title. A terms page is judged first on
   whether it says when it took effect, so it sits above the opening paragraph
   rather than in a footer nobody scrolls to. */
#policy-doc .eff{margin-top:10px;font-family:"IBM Plex Mono",monospace;font-size:10.5px;
  letter-spacing:.06em;color:var(--meta,#72767B);text-transform:uppercase}

/* section head — the numbered divider that opens 01 … 10 */
#policy-doc .sec{margin-top:32px;padding-top:19px;border-top:1px solid var(--line,#E5E3DD)}
#policy-doc .sec .num{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.17em;
  color:var(--meta,#72767B);font-weight:500}

/* callout */
#policy-doc .note{border:1px solid var(--line,#E5E3DD);
  border-left:3px solid var(--signal,#0E6E52);background:#fff;padding:13px 15px;margin-top:16px}
#policy-doc .note .nh{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink,#101A24);font-weight:500}
#policy-doc .note p:first-of-type{margin-top:6px}

/* the pre-approval banner. Amber, not green — it is a warning, not a feature,
   and it comes off entirely when the Founder signs. */
#policy-doc .draft{border:1px solid var(--line,#E5E3DD);
  border-left:3px solid var(--risk,#B26A1F);background:#fff;padding:12px 15px;margin-top:17px;
  font-size:13px;color:var(--slate-d,#5A636E);line-height:1.55}

#policy-doc .upd{margin-top:26px;padding-top:15px;border-top:1px solid var(--line,#E5E3DD);
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--meta,#72767B);
  letter-spacing:.04em;line-height:1.7}

@media(max-width:640px){ #policy-doc .sec{margin-top:27px;padding-top:17px} }

/* ── added 30 Sep 2026 for /terms and /privacy ─────────────────────────
   These three pages share this file. The Recommendation Policy uses only the
   rules above; the Terms and the Privacy Policy add numbered sub-clauses,
   all-caps statutory blocks and tables. Scoped to #policy-doc like everything
   else, so the landing page's sheet keeps working unchanged. */

/* numbered sub-clause heading: 16.2, 9.4 … */
#policy-doc h3{font-family:Inter,system-ui,sans-serif;font-weight:600;font-size:14px;
  letter-spacing:-.005em;color:var(--ink,#101A24);margin:22px 0 0}

/* the summary heading on the privacy policy */
#policy-doc h2.lead{margin-top:30px}

/* ALL-CAPS statutory blocks. Left as authored - they are conspicuous by
   convention and courts have opinions about that - but set at a readable size
   with generous leading, because a wall of caps at 13.5px is unreadable and an
   unreadable disclaimer is a weaker one. */
#policy-doc .caps{font-size:12.5px;line-height:1.72;letter-spacing:.005em;
  color:var(--slate-d,#5A636E);background:#fff;border:1px solid var(--line,#E5E3DD);
  padding:13px 15px;margin-top:13px}

/* tables scroll rather than squeeze on a phone */
#policy-doc .tw{max-width:none;margin-top:14px;overflow-x:auto;-webkit-overflow-scrolling:touch}
#policy-doc table{border-collapse:collapse;width:100%;min-width:480px;font-size:12.5px;
  color:var(--slate-d,#5A636E)}
#policy-doc th,#policy-doc td{text-align:left;vertical-align:top;padding:8px 14px 8px 0;
  border-bottom:1px solid var(--line,#E5E3DD);line-height:1.55}
#policy-doc thead th{color:var(--ink,#101A24);font-weight:600;font-size:11.5px;
  letter-spacing:.04em;text-transform:uppercase;border-bottom-color:var(--slate-l,#B9C0C8)}
#policy-doc tbody th{color:var(--ink,#101A24);font-weight:600;padding-right:18px}
#policy-doc td:last-child,#policy-doc th:last-child{padding-right:0}

@media(max-width:700px){
  #policy-doc .tw::after{content:"Scroll the table for the remaining columns \2192";
    position:sticky;left:0;display:block;width:max-content;max-width:100%;
    padding-top:9px;font-family:"IBM Plex Mono",monospace;font-size:10.5px;
    letter-spacing:.03em;color:var(--meta,#72767B)}
}