/* Shared frame for the formal pages (vision, research, about, privacy): the floating pill menu, full-screen menu and black footer.
   Prefixed fx- so nothing inside the pages collides. The manifesto loads only this file, so its reading layout stays original. */
:root { --hdr: 92px; --fx-ink: #0B0B0B; --fx-off: #F5F4F1; --fx-muted: #6E6D69; --fx-sun: #FF8A1F; --fx-ease: cubic-bezier(.2, .7, .2, 1); }
body { padding-top: 96px; }
.fx-pill { position: fixed; top: 14px; left: 50%; transform: translateX(-50%); z-index: 100; display: flex; align-items: center; gap: 22px; height: 64px; padding: 0 12px 0 26px;
  border-radius: 22px; background: rgb(255 255 255 / .72); -webkit-backdrop-filter: saturate(1.6) blur(20px); backdrop-filter: saturate(1.6) blur(20px);
  box-shadow: 0 0 0 1px rgb(11 11 11 / .07), 0 10px 30px -18px rgb(0 0 0 / .3); font-family: "Inter", system-ui, sans-serif; white-space: nowrap; }
.fx-logo { font: 800 27px/1 "Inter", system-ui, sans-serif; letter-spacing: -0.07em; color: var(--fx-ink); text-decoration: none; }
.fx-links { display: flex; gap: 26px; margin: 0 6px 0 18px; }
.fx-links a { font-size: 16px; font-weight: 500; letter-spacing: -0.02em; color: rgb(11 11 11 / .7); text-decoration: none; transition: color .2s; }
.fx-links a:hover, .fx-links a[aria-current="page"] { color: var(--fx-ink); }
.fx-links a[aria-current="page"] { font-weight: 600; }
.fx-acts { display: flex; align-items: center; gap: 6px; }
.fx-btn { display: inline-flex; align-items: center; height: 40px; padding: 0 18px; border-radius: 999px; background: var(--fx-ink); color: #fff; font: 600 15px/1 "Inter", sans-serif; letter-spacing: -0.02em; text-decoration: none; transition: background .2s; }
.fx-btn:hover { background: #2b2b2b; }
.fx-menu-btn { width: 44px; height: 44px; border: 0; background: none; cursor: pointer; display: grid; place-items: center; border-radius: 12px; padding: 0; }
.fx-menu-btn svg { width: 24px; height: 24px; stroke: var(--fx-ink); stroke-width: 2; stroke-linecap: round; fill: none; }
.fx-menu { position: fixed; inset: 0; z-index: 150; background: var(--fx-ink); color: #fff; padding: 110px clamp(16px, 3vw, 40px) 40px; display: flex; flex-direction: column; justify-content: space-between;
  opacity: 0; visibility: hidden; transition: opacity .35s var(--fx-ease), visibility .35s; font-family: "Inter", sans-serif; }
.fx-open .fx-menu { opacity: 1; visibility: visible; }
.fx-open .fx-pill { z-index: 170; background: rgb(255 255 255 / .94); }
.fx-menu nav { display: flex; flex-direction: column; }
.fx-menu nav a { font-size: clamp(40px, 7vw, 88px); font-weight: 800; letter-spacing: -0.06em; line-height: 1.05; color: #fff; text-decoration: none; width: fit-content; transition: color .2s; }
.fx-menu nav a:hover { color: var(--fx-sun); }
.fx-menu .small { display: flex; gap: 28px; flex-wrap: wrap; font-size: 17px; }
.fx-menu .small a { color: rgb(255 255 255 / .7); text-decoration: none; }
@media (max-width: 860px) { .fx-links { display: none; } }
@media (max-width: 600px) {
  :root { --hdr: 84px; } body { padding-top: 88px; }
  .fx-pill { width: calc(100% - 24px); justify-content: space-between; height: 58px; padding: 0 8px 0 18px; }
}
@media print { .fx-pill, .fx-menu { display: none !important; } body { padding-top: 0; } }


:root { --hdr: 78px; }
@media (max-width: 600px) { :root { --hdr: 72px; } }
.topbar { box-shadow: 0 -40px 0 0 #fff; }

/* one typeface across the whole site: Inter replaces the typewriter font; sizes, capitals and spacing stay as designed */
:root { --mono: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif !important; }
.mono, .links a, .foot, .pill, .reserve label, .talk, .askai, .askai.chip, .chip, .chip.pdf, .askai-pop p {
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif !important; }