/* Any Legal Robot — shared brand styles for the consent-screen pages.
   Serif is the legal half, mono is the machine half; the tension is the brand.
   System font stacks only — no external font fetches. */

:root{
  --ink:#1B1B1F;
  --oxblood:#7A2231;
  --amber:#E8A33D;
  --manila:#EDE3CC;
  --paper:#F7F2E6;
  --signal:#2E7D5B;
  --muted:#6b6673;
  --lede:#4a4650;
  --hairline:rgba(27,27,31,.18);
  --serif:Charter,"Source Serif 4",Georgia,serif;
  --mono:"Berkeley Mono","JetBrains Mono",ui-monospace,monospace;
  color-scheme:light;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--serif);
  font-size:17px;
  line-height:1.6;
}
.wrap{max-width:720px;margin:0 auto;padding:32px 24px 80px}

/* Header lockup + nav */
.site-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding-bottom:18px;border-bottom:1px solid var(--hairline);
}
.site-head .brand{display:inline-flex;align-items:center;line-height:0}
.site-head .lockup{height:32px;width:auto;display:block}
.site-head nav{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.site-head nav a{color:var(--muted);text-decoration:none;margin-left:20px}
.site-head nav a:hover{color:var(--oxblood)}

/* Masthead */
.eyebrow{
  font-family:var(--mono);font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--oxblood);margin:40px 0 0;
}
h1{
  font-family:var(--serif);font-weight:500;line-height:1.08;
  font-size:clamp(30px,6vw,44px);margin:.15em 0 .25em;
}
h1 .mono{font-family:var(--mono);color:var(--oxblood);letter-spacing:.04em}
.lede{max-width:54ch;color:var(--lede);font-size:1.12rem;margin:0}
p.meta{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--muted);margin:.4em 0 0}

/* Hero robot */
.hero{display:flex;gap:32px;align-items:flex-start;flex-wrap:wrap}
.hero .copy{flex:1 1 340px;min-width:0}
.hero .figure{flex:0 0 auto;margin-left:auto}
.hero .figure img{height:200px;width:auto;display:block}

/* Sections */
section{margin-top:44px;border-top:1px solid var(--hairline);padding-top:22px}
h2{
  font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:500;color:var(--muted);margin:0 0 14px;
}
h2 .dot{color:var(--amber)}
p{margin:.6em 0}
ul{padding-left:1.2rem;margin:.6em 0}
li{margin:.35em 0}
a{color:var(--oxblood)}
a:hover{text-decoration:underline}
code{font-family:var(--mono);font-size:.88em;background:var(--manila);padding:1px 5px;border-radius:2px}

/* Limited Use / emphasis callout — manila tile, oxblood rule */
.callout{background:var(--manila);border-left:3px solid var(--oxblood);padding:16px 18px;margin:20px 0}
.callout strong{color:var(--oxblood)}

/* Footer */
footer{
  margin-top:60px;padding-top:20px;border-top:1px solid var(--hairline);
  font-family:var(--mono);font-size:12px;color:var(--muted);
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:space-between;
}
footer .mark{height:22px;width:auto;display:block;opacity:.9}
footer .foot-left{display:flex;align-items:center;gap:12px}
footer nav a{color:var(--muted);text-decoration:none;margin-left:16px}
footer nav a:hover{color:var(--oxblood)}