/* Boundary Layer Labs' site: BLOM's brand r2 tokens, the few this site uses, copied from
   apps/web/src/design-system/tokens.css (Decisions 144 and 150). Fonts are self-hosted from
   ./fonts (SIL OFL 1.1; licences beside them), so the policy's font-src 'self' holds. The layout
   spans the full window, inside the design library's page gutters. */

@font-face{font-family:"Albert Sans";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/albert-sans-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Albert Sans";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/albert-sans-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:300;font-display:swap;src:url("fonts/newsreader-latin-300-normal.woff2") format("woff2")}

:root{
  --boundary-50:#EEF6F9;--boundary-200:#B9D6E2;--boundary-700:#155167;--boundary-800:#0E3F52;--boundary-900:#082C3A;
  --surface-page:#F2F0EB;--surface-raised:#FAF9F6;--border-subtle:#E0DCD3;--border-strong:#97907F;--border-focus:#006C69;
  --text-primary:#2E2C27;--text-secondary:#5F5A50;--text-brand:#0E3F52;--text-link:#155167;
  --callout-fill:#EEF6F9;--callout-border:#B9D6E2;
  --font-ui:"Albert Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-display:"Newsreader",Georgia,"Times New Roman",serif;
  --page-gutter:32px;--radius:10px;
  color-scheme:light;
}
@media (max-width:1279px){:root{--page-gutter:24px}}
@media (max-width:767px){:root{--page-gutter:16px}}

*{box-sizing:border-box}
html{background:var(--surface-page);color:var(--text-primary);font:400 16px/1.6 var(--font-ui);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{margin:0;min-height:100vh;display:flex;flex-direction:column}
a{color:var(--text-link);text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--border-strong)}
a:hover{text-decoration-color:currentColor}
:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}
h1,h2,h3{text-wrap:balance}

.skip{position:absolute;left:-9999px;top:0;background:var(--surface-raised);padding:8px 12px;z-index:1}
.skip:focus{left:var(--page-gutter)}

.topbar{background:var(--boundary-800);color:var(--boundary-50)}
.topbar-inner{margin:0;padding:14px var(--page-gutter);display:flex;align-items:center;gap:16px}
.wordmark{font:600 20px/28px var(--font-ui);letter-spacing:0.08em;color:var(--boundary-50);text-decoration:none}
.topbar-company{margin-left:auto;font-size:14px;color:var(--boundary-200)}

main{flex:1;width:100%;margin:0;padding:56px var(--page-gutter) 72px}

.eyebrow{display:inline-block;font:600 12px/16px var(--font-ui);letter-spacing:0.08em;text-transform:uppercase;color:var(--boundary-800);background:var(--callout-fill);border:1px solid var(--callout-border);border-radius:9999px;padding:4px 12px}
.hero h1{font:300 56px/64px var(--font-display);color:var(--text-brand);margin:20px 0 16px}
.lead{font-size:20px;line-height:1.5;margin:0 0 16px}
.actions{margin:32px 0 8px;display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.button{display:inline-block;background:var(--boundary-800);color:#FFFFFF;font-weight:600;text-decoration:none;border-radius:var(--radius);padding:12px 20px}
.button:hover{background:var(--boundary-700)}
.note{color:var(--text-secondary);font-size:14px;margin:0}
@media (max-width:767px){.hero h1{font-size:40px;line-height:48px}.lead{font-size:18px}}

.legal h1{font:300 44px/52px var(--font-display);color:var(--text-brand);margin:0 0 8px}
.legal .version{color:var(--text-secondary);font-size:14px;margin:0 0 32px}
.legal .archived{background:var(--callout-fill);border:1px solid var(--callout-border);border-radius:var(--radius);padding:12px 16px;margin:-16px 0 32px}
.legal h2{font:600 20px/28px var(--font-ui);color:var(--text-brand);margin:40px 0 8px;scroll-margin-top:16px}
.legal h3{font:600 16px/24px var(--font-ui);margin:24px 0 4px}
.legal ul{padding-left:22px}
.legal li{margin:6px 0}
.legal code{font-family:ui-monospace,"Cascadia Mono","SFMono-Regular",Consolas,monospace;font-size:14px;background:var(--surface-raised);border:1px solid var(--border-subtle);border-radius:4px;padding:1px 5px}
.legal .contents{background:var(--surface-raised);border:1px solid var(--border-subtle);border-radius:var(--radius);padding:12px 20px 12px 40px;margin:0 0 8px}
.legal .contents li{margin:2px 0}

.footer{border-top:1px solid var(--border-subtle)}
.footer-inner{margin:0;padding:20px var(--page-gutter);display:flex;flex-wrap:wrap;gap:8px 24px;font-size:14px;color:var(--text-secondary)}
.footer-inner p{margin:0}
.footer-links{display:flex;flex-wrap:wrap;gap:8px 20px;margin-left:auto}
