/* Parallax — site.css
   The public site's whole design, as ruled by the owner on 9 September 2026: off the brand, in the register the
   serious quant firms keep. One grotesk at text weights, a white ground, grey for what is secondary, no colour, no
   decoration; the dark version it was ruled from is one line of tokens away. Nothing here derives from assets/brand; that departure is recorded in website/README.md.
   Nothing loads from a network: the face is self-hosted in fonts/. */

@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:300 700;font-display:block;src:url(fonts/hanken-grotesk-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:'Hanken Grotesk';font-style:normal;font-weight:300 700;font-display:swap;src:url(fonts/hanken-grotesk-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:#FFFFFF;--raised:#F5F5F5;--ink:#141414;--sec:#4A4A4A;--mut:#8A8A8A;--rule:#E6E6E6;--err:#B3261E;
  --sans:'Hanken Grotesk',Helvetica,Arial,sans-serif;--pad:40px;--wrap:1120px;--measure:640px}

/* ---- base ---- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
h1,h2,h3{font-weight:400;overflow-wrap:break-word;hyphens:none}
b,strong{font-weight:500}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%}
:focus-visible{outline:1px solid var(--ink);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}
.skip{position:absolute;left:-9999px;top:0}
.skip:focus{position:fixed;left:16px;top:16px;z-index:50;background:var(--ink);color:var(--bg);padding:8px 14px;font-size:15px}

/* ---- the masthead: the name and two links ---- */
.masthead .wrap{display:flex;justify-content:space-between;align-items:center;height:64px;font-size:15px}
.brand{display:inline-flex;align-items:center;gap:8px;font-weight:500}
.brand svg{width:16px;height:16px;display:block;color:var(--ink)}
.nav{display:flex;gap:24px}
.nav a{color:var(--mut);transition:color .2s}
.nav a:hover,.nav a[aria-current="page"]{color:var(--ink)}

/* ---- the home page: a head, then one column of reading with its headings in grey ---- */
.head{padding:104px 0 96px;max-width:720px}
.display{font-size:40px;line-height:1.18;letter-spacing:-.01em;max-width:22ch;text-wrap:balance}
.stand{margin-top:24px;font-size:20px;line-height:1.4;color:var(--sec);max-width:32ch}
.home{max-width:var(--measure);padding-bottom:96px}
.home section + section{margin-top:52px}
.home h2{font-size:15px;color:var(--mut)}
.home section p{margin-top:10px}
.home section p + p{margin-top:14px}
.home section a:not(.fn),.prose a,.def a,.callout a,.form-note a,.lede a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.15em}
.home section a:not(.fn):hover,.prose a:hover,.def a:hover,.callout a:hover,.form-note a:hover,.lede a:hover{color:var(--sec)}
.fn{font-size:11px;line-height:1;vertical-align:super;margin-left:1px;color:var(--mut)}
.fn:hover{color:var(--ink)}
/* the name's footnote. It opens beside the line it belongs to — in the margin the reading column
   leaves empty, once there is room for one — and the next click elsewhere closes it. With site.js
   blocked the :target rule still opens it, in place, and it stays open until the page reloads. */
.fnhost{position:relative}
.home section .fnhost + p{margin-top:14px}
.note{display:none;margin-top:18px;padding-left:16px;border-left:1px solid var(--rule);
  font-size:15px;line-height:1.55;color:var(--mut)}
.note:target,.note.is-open{display:block}
.note p{margin-top:0}
.note .fnum{font-size:14px;color:var(--mut);margin-right:8px}
@media (min-width:1080px){
  .note{position:absolute;top:34px;left:calc(100% + 32px);width:300px;
    margin-top:0;padding-left:0;border-left:0;border-top:1px solid var(--rule);padding-top:10px}
}

/* ---- the other pages: a head, then ruled rows with their names at the left ---- */
.hero{padding:96px 0 72px}
.hero .display{max-width:20ch}
.eyebrow{font-size:15px;color:var(--mut);margin-bottom:16px}
.lede{font-size:20px;line-height:1.4;color:var(--sec);max-width:34ch;text-wrap:pretty}
.hero .lede{margin-top:24px;max-width:40ch}
.qualifier{font-size:15px;color:var(--mut)}
.section{padding:56px 0;border-top:1px solid var(--rule);scroll-margin-top:16px}
.row{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px 40px}
.row > .label{font-size:15px;color:var(--mut);padding-top:5px}
.display-sm{font-size:26px;line-height:1.25;letter-spacing:-.005em;max-width:24ch;text-wrap:balance}
.measure{max-width:var(--measure)}
.measure + .measure{margin-top:1em}
.mt{margin-top:20px}
.mt-lg{margin-top:40px}

/* the definitions on the experts page: a heading and its paragraph, ruled */
.defs{display:grid}
.def{padding:24px 0;border-top:1px solid var(--rule)}
.def:first-child{border-top:0;padding-top:0}
.def .ord{display:block;font-size:15px;color:var(--mut);margin-bottom:6px}
.title-sm{font-size:17px;font-weight:500;line-height:1.4;margin-bottom:6px}
.def p{color:var(--sec)}
.callout{margin-top:24px;border:1px solid var(--rule);padding:20px 24px;max-width:var(--measure);color:var(--sec)}
.callout p + p{margin-top:.75em}

/* ---- the form on the experts page ---- */
.btn{display:inline-block;font-family:var(--sans);font-size:15px;font-weight:500;padding:11px 18px;background:var(--ink);color:var(--bg);border:1px solid var(--ink);border-radius:0;cursor:pointer;transition:background .2s,border-color .2s}
.btn:hover{background:var(--sec);border-color:var(--sec)}
.btn:disabled{opacity:.6;cursor:default}
.form{max-width:520px}
.field{margin-bottom:24px}
.field label{display:block;font-size:15px;color:var(--mut);margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;font:inherit;font-size:17px;line-height:1.5;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--rule);border-radius:0;padding:8px 0;appearance:none;transition:border-color .2s}
.field select option{background:var(--bg);color:var(--ink)}
.field textarea{min-height:112px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--ink)}
.field .hint{margin-top:8px;font-size:14px;color:var(--mut)}
.form-note{margin-top:24px;font-size:14px;line-height:1.5;color:var(--mut);max-width:520px}
.form-status{margin-top:20px;font-size:15px;display:none}
.form-status[data-state]{display:block}
.form-status[data-state="ok"]{color:var(--sec)}
.form-status[data-state="err"]{color:var(--err)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---- the legal documents ---- */
.doc{padding:72px 0 96px}
.doc .body{max-width:var(--measure)}
.doc .body p,.doc .body ul,.doc .body dl{margin:0 0 1.05em}
.doc .body ul{padding-left:1.1em}
.doc .body li{margin-bottom:.45em}
.doc .body li::marker{color:var(--mut)}
.doc .body a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.15em}
.doc .body a:hover{color:var(--sec)}
.doc h2{font-size:20px;font-weight:500;line-height:1.3;margin:44px 0 10px}
.doc h3{font-size:17px;font-weight:500;line-height:1.4;margin:24px 0 6px}
.doc .toc{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:20px 0;margin-top:32px;max-width:var(--measure)}
.doc .toc ul{columns:2;column-gap:40px;list-style:none;padding:0}
.doc .toc li{margin:0 0 6px;break-inside:avoid}
.doc .toc a{font-size:15px;color:var(--mut)}
.doc .toc a:hover{color:var(--ink)}
.doc dt{font-size:15px;color:var(--mut);margin:1em 0 4px}
.doc dd{margin:0}

/* ---- the colophon: the entity and the address ---- */
.colophon{border-top:1px solid var(--rule);padding:36px 0}
.colophon .entity{display:flex;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;font-size:14px;color:var(--mut)}
.colophon .entity .left{display:flex;flex-wrap:wrap;gap:0 20px}
.colophon a:hover{color:var(--ink)}

/* ---- narrow screens ---- */
@media (max-width:720px){
  :root{--pad:20px}
  .head{padding:56px 0 56px}
  .display{font-size:31px}
  .stand,.lede{font-size:19px}
  .home{padding-bottom:64px}
  .home section + section{margin-top:40px}
  .hero{padding:56px 0 48px}
  .section{padding:40px 0}
  .row{grid-template-columns:1fr;gap:12px}
  .row > .label{padding-top:0}
  .display-sm{font-size:23px}
  .doc{padding:48px 0 64px}
  .doc .toc ul{columns:1}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}html{scroll-behavior:auto}}
@media print{body{background:#fff;color:#111}.masthead,.form,.skip{display:none}.doc .toc a,.colophon,.colophon .entity{color:#111}}
