/* =========================================================================
   INVISIBLE PRODUCT INC.  —  DOCUMENT PAGES (terms, privacy)

   The landing page at / is a CANVAS: every length is a fraction of a 1280
   frame Tony drew in Figma, and the type scales with the viewport. A legal
   document is not a canvas, so this stylesheet keeps the identity and drops
   the machinery. Shared with the landing page: the white ground, self-hosted
   Inter, the #111111 ink and #999999 grey, the 20px margin, the 72px nav band,
   uppercase display headings, and no border anywhere except the one hairline
   rule the footer already uses.

   ONE DELIBERATE DEPARTURE, AND IT IS READABILITY. Every line of body copy on
   the landing page is 12px uppercase tracked at 0.04em, which is right for a
   caption of two lines and unreadable for a page of clauses. Body here is
   15px, sentence case, weight 300, on a 640px measure. Headings stay uppercase
   so the page is recognisably the same site. If Tony wants the documents in
   the landing page's own uppercase micro, that is a one-line change here and
   nothing in the markup moves.
   ========================================================================= */
@font-face{
  font-family:Inter;
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  /* resolved against THIS FILE (demo/doc.css), not against the page that links
     it, so it is fonts/ and not ../fonts/ even though the pages are a level
     deeper. Getting that backwards 404s the face and the documents silently
     fall back to system sans. */
  src:url(fonts/inter-latin-var.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root{
  --ink:#111111;
  --grey:#999999;
  --edge:#EEEEEE;
  --m:20px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:#FFFFFF;
  color:var(--ink);
  font-family:Inter,system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  /* the same stem-weight correction the landing page carries: without it macOS
     dilates the stems and the 200s and 300s read a full step heavier */
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-synthesis-weight:none;
}
/* hidden on one axis forces the other to auto, which is the fault that clipped
   the landing page's wordmark. clip on one axis does not. */
.page{overflow-x:clip}

a{color:inherit}
.micro{font-size:12px;line-height:1.25;font-weight:400;letter-spacing:.04em;text-transform:uppercase}
.w200{font-weight:200}
.grey{color:var(--grey)}

/* THE NAV BAND IS GONE, AND SO ARE ITS RULES. Tony, 2026-09-12: no calls to
   action and no logo on a legal page, so no bar at all. `.nav`, `.navlogo`,
   `.navright`, `.textlink`, `.btn` and `.chev-sm` were deleted with it rather
   than left sitting here unused: dead CSS is the same lie as a stale comment,
   and the next person to read this file would reasonably assume a page still
   uses them. The same applies to `--nav` above and to `.w300`/`.w500`, which
   dressed the two buttons and the logo and nothing else. If a document ever
   needs a bar again, take it from demo/index.html rather than reviving this. */

/* ------------------------------------------------------------- DOCUMENT */
/* THE TITLE STARTS WHERE THE BAND USED TO END. This padding was measured from
   below a 72px sticky header; with the header gone the same value lands the h1
   at roughly where the band's lower edge sat, which is the "move up
   accordingly" without leaving the document jammed against the viewport. */
.doc{max-width:640px;margin:0;padding:clamp(48px,8vh,96px) var(--m) 0}
h1{
  margin:0;
  font-size:40px;line-height:1.2;font-weight:400;
  text-transform:uppercase;letter-spacing:-.01em;
}
.stamp{margin:16px 0 0;color:var(--grey)}
.lede{margin:40px 0 0;font-size:15px;line-height:1.6;font-weight:300}
h2{
  margin:48px 0 0;
  font-size:12px;line-height:1.25;font-weight:400;
  letter-spacing:.04em;text-transform:uppercase;
}
.doc p{margin:12px 0 0;font-size:15px;line-height:1.6;font-weight:300}
.doc ul{margin:12px 0 0;padding-left:18px}
.doc li{margin:6px 0 0;font-size:15px;line-height:1.6;font-weight:300}

/* --------------------------------------------------------------- FOOTER */
.docfoot{margin-top:96px;padding:0 var(--m) 40px}
.rule{height:1px;background:var(--edge);margin-bottom:20px}
.docfoot .row{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.docfoot a{text-decoration:none}

@media (max-width:640px){
  h1{font-size:32px}
  /* 44 is the tap floor the landing page's own device check asserts */
  .docfoot a{min-height:44px;display:inline-flex;align-items:center}
}