/* Shared shell for the legal pages (privacy.html, terms.html).
Same tokens and same nav/footer as index.html, plus a document type scale:
the landing's 30px body is display copy, legal prose reads at 18px. */
@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:400 500;font-stretch:100%;src:url(assets/instrument-sans-latin.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;}
@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:400 500;font-stretch:100%;src:url(assets/instrument-sans-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
:root{
--bg:#EDE8E8; --panel:#C0DFE9; --surface:#FFFFFF;
--ink:#000000; --ink-mute:rgba(0,0,0,.5);
--rule:#000000;
--accent:#A8F0C8; --accent-ink:#000000;
--radius:1.4rem;
--font:"Instrument Sans","Helvetica Neue",Helvetica,Arial,"Liberation Sans",system-ui,sans-serif;
--fs-micro:1.6rem; /* 12px band, labels, nav */
--fs-title:9rem; /* 67px page title */
/* document scale */
--lg-lead:3.4rem; /* 25px standfirst */
--lg-h2:4.4rem; /* 33px numbered clause */
--lg-h3:2.8rem; /* 21px sub-clause */
--lg-body:2.4rem; /* 18px prose */
}
html{ font-size:max(5.2px, calc(100vw / 192)); scroll-behavior:smooth; }
*{ box-sizing:border-box; }
body{
margin:0; background:var(--bg); color:var(--ink); font-family:var(--font);
font-weight:400; font-size:var(--lg-body); line-height:1.25;
font-synthesis:none; -webkit-font-smoothing:antialiased;
padding:0 2.13rem 2.13rem; overflow-x:hidden;
}
strong,b{ font-weight:500; }
::selection{ background:var(--accent); color:var(--accent-ink); }
h1,h2,h3{ font-weight:400; margin:0; text-wrap:balance; }
p{ margin:0; }
/* ---------- NAV: the same glass pill as the landing ---------- */
.nav{
position:fixed; top:2.13rem; left:0; right:0; z-index:60; margin:0 auto;
width:max-content; max-width:calc(100% - 4.26rem);
display:flex; align-items:center; gap:1rem;
background:rgba(255,255,255,.4); backdrop-filter:blur(7.5px); -webkit-backdrop-filter:blur(7.5px);
border-radius:100px; padding:1rem;
}
.nav .brand{ display:flex; align-items:center; gap:1.4rem; font-size:var(--fs-micro); font-weight:500;
text-transform:uppercase; padding:0 2rem; color:var(--ink); text-decoration:none; }
.nav .brand svg{ width:3.4rem; height:3.2rem; flex:none; }
.nav .links{ display:flex; gap:0; }
.nav .links a{
white-space:nowrap; color:var(--ink); text-decoration:none; font-size:var(--fs-micro); font-weight:500;
padding:1.4rem 2.6rem; border-radius:100px; transition:background .18s ease;
}
.nav .links a:hover{ background:rgba(255,255,255,.55); }
.nav .links a[aria-current="page"]{ background:rgba(255,255,255,.7); }
@media (max-width:900px){ .nav .links{ display:none; } }
.cta{
white-space:nowrap; display:inline-block; background:var(--ink); color:var(--bg); text-decoration:none;
border-radius:100px; padding:1.4rem 3rem; font-size:var(--fs-micro); font-weight:500;
border:1px solid var(--ink); transition:background .18s ease,color .18s ease,border-color .18s ease;
}
.cta:hover{ background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }
.cta:focus-visible{ outline:2px solid var(--ink); outline-offset:3px; }
/* ---------- PAGE SHELL ---------- */
section{ border-radius:var(--radius); padding:6rem 5rem 7rem; margin-bottom:5rem; position:relative; }
.p-canvas{ background:transparent; }
.p-surface{ background:var(--surface); }
.inner{ max-width:149rem; margin:0 auto; width:100%; }
.masthead{ padding-top:calc(var(--nav-h, 8rem) + 12rem); }
.band{
display:grid; grid-template-columns:1fr 1fr 1fr; align-items:baseline;
font-size:var(--fs-micro); font-weight:500; text-transform:uppercase; color:var(--ink);
padding:2rem 0; border-bottom:1px solid var(--rule);
font-variant-numeric:tabular-nums; margin-bottom:8rem;
}
.band > :nth-child(2){ text-align:center; }
.band > :nth-child(3){ text-align:right; }
.masthead h1{ font-size:var(--fs-title); line-height:1.0; max-width:14ch; margin-bottom:4rem; }
.masthead .lead{ font-size:var(--lg-lead); line-height:1.25; max-width:52ch; color:var(--ink-mute); }
/* the placeholder callout: everything still to be filled in is highlighted,
so an unfinished document cannot be mistaken for a finished one */
.note{
margin-top:5rem; border-top:1px solid var(--rule); padding-top:2.4rem;
font-size:var(--lg-body); line-height:1.5; max-width:76ch;
}
.note b{ display:block; font-size:var(--fs-micro); text-transform:uppercase; margin-bottom:1.2rem; }
.ph{ background:var(--accent); color:var(--accent-ink); padding:0 .25em;
box-decoration-break:clone; -webkit-box-decoration-break:clone; }
/* ---------- DOCUMENT ---------- */
.doc-in{ max-width:92rem; margin:0 auto; }
.toc{ border-bottom:1px solid var(--rule); padding-bottom:4rem; margin-bottom:5rem; }
.toc h2{ font-size:var(--fs-micro); font-weight:500; text-transform:uppercase; margin-bottom:2.4rem; }
.toc ol{ margin:0; padding:0; list-style:none; counter-reset:toc;
columns:2; column-gap:5rem; font-size:var(--lg-body); line-height:1.5; }
.toc li{ counter-increment:toc; break-inside:avoid; margin-bottom:.8rem; }
.toc li::before{ content:counter(toc) ". "; color:var(--ink-mute); font-variant-numeric:tabular-nums; }
.toc a{ color:var(--ink); text-decoration:none; border-bottom:1px solid transparent; }
.toc a:hover{ border-bottom-color:var(--ink); }
@media (max-width:820px){ .toc ol{ columns:1; } }
.doc h2{
font-size:var(--lg-h2); line-height:1.1; margin:6rem 0 2.4rem;
padding-bottom:1.6rem; border-bottom:1px solid var(--rule);
scroll-margin-top:calc(var(--nav-h, 8rem) + 4rem);
}
.doc h2:first-of-type{ margin-top:0; }
.doc h2 .n{ display:block; font-size:var(--fs-micro); font-weight:500; text-transform:uppercase;
color:var(--ink-mute); margin-bottom:1.2rem; font-variant-numeric:tabular-nums; }
.doc h3{ font-size:var(--lg-h3); font-weight:500; line-height:1.25; margin:4rem 0 1.6rem; }
.doc p{ font-size:var(--lg-body); line-height:1.62; margin-bottom:2rem; }
.doc ul{ margin:0 0 2rem; padding:0; list-style:none; }
.doc ul li{ font-size:var(--lg-body); line-height:1.62; margin-bottom:1.2rem;
display:flex; gap:1.6rem; align-items:baseline; }
.doc ul li::before{ content:""; width:.9rem; height:.9rem; background:var(--accent);
flex:none; transform:translateY(-.25rem); }
.doc dl{ margin:0 0 2rem; font-size:var(--lg-body); line-height:1.62; }
.doc dt{ font-weight:500; margin-top:2rem; }
.doc dd{ margin:0; color:var(--ink-mute); }
.doc a{ color:var(--ink); text-decoration:underline; text-underline-offset:.25em; }
.doc a:hover{ background:var(--accent); }
.doc .last{ font-size:var(--fs-micro); font-weight:500; text-transform:uppercase;
color:var(--ink-mute); margin-top:6rem; padding-top:2.4rem; border-top:1px solid var(--rule); }
/* ---------- FOOTER ---------- */
.footer{ margin-top:0; }
.foot-bar{ border-top:1px solid var(--rule); padding-top:3rem;
display:flex; justify-content:space-between; gap:3rem; flex-wrap:wrap;
font-size:var(--fs-micro); font-weight:500; text-transform:uppercase; }
.foot-bar a{ color:var(--ink); text-decoration:none; }
.foot-bar a:hover{ background:var(--accent); }
.foot-bar .links{ display:flex; gap:5rem; flex-wrap:wrap; }
/* small screens: the clamped root leaves the document scale too small */
@media (max-width:820px){
:root{ --fs-micro:2.4rem; --fs-title:6.6rem;
--lg-lead:4.2rem; --lg-h2:5.4rem; --lg-h3:3.8rem; --lg-body:3.2rem; }
}
@media (max-width:1000px){
section{ padding:5rem 3rem 6rem; margin-bottom:2.4rem; }
.masthead{ padding-top:calc(var(--nav-h, 8rem) + 8rem); }
.band{ margin-bottom:5rem; }
.masthead h1{ max-width:none; }
.foot-bar .links{ gap:3rem; }
}
@media (prefers-reduced-motion:reduce){ *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; } }