/* Glint — the header and footer shared by the three main pages (Home, Science,
   Founding Beta). Edges line up with the home page: --chrome-gutter is the home
   page's gutter. Loaded after each page's own stylesheet. */
:root { --chrome-gutter: clamp(20px, 5vw, 72px); }
/* The home page's system font, on every page (the Science page's own text uses Instrument Sans). */
.site-header, .site-footer {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Helvetica Neue", "Segoe UI", Roboto, Inter, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* ---------- Header: glint · Science · Founding beta ---------- */
.site-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding: max(18px, env(safe-area-inset-top)) var(--chrome-gutter) 18px;
  background: #0b0b0a;
  color: #fafaf8;
}
/* Home: over the hero photo, inside its padding (no bar, same edges). */
.site-header--overlay { padding: 0; background: transparent; }
.site-header__wordmark {
  font-family: "Instrument Serif", Georgia, "Times New Roman", serif;
  font-size: clamp(1.75rem, 2.1vw, 2.125rem);
  font-weight: 400;
  line-height: 1;
  color: inherit;
  text-decoration: none;
}
.site-header__nav { display: flex; align-items: center; gap: clamp(16px, 2.2vw, 28px); }
.site-header__link {
  color: #b9b7b0;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  transition: color 150ms ease-out;
}
.site-header--overlay .site-header__link { color: rgba(250, 250, 248, 0.82); }
.site-header__link[aria-current="page"],
.site-header__link:hover { color: #fafaf8; }
/* Founding Beta: a white bar on the white page, dark text. */
.site-header--light { background: #ffffff; color: #0b0b0a; }
.site-header--light .site-header__link { color: #6e6e73; }
.site-header--light .site-header__link[aria-current="page"],
.site-header--light .site-header__link:hover { color: #0b0b0a; }

/* ---------- Footer ---------- */
.site-footer {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 36px var(--chrome-gutter) max(40px, env(safe-area-inset-bottom));
  border-top: 1px solid #dddbd5;
  background: #fafaf8;
  color: #66645e;
  font-size: 13px;
  line-height: 1.55;
}
.site-footer__top,
.site-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 32px; }
.site-footer__wordmark {
  font-family: "Instrument Serif", Georgia, "Times New Roman", serif;
  font-size: 30px;
  line-height: 1;
  color: #0b0b0a;
  text-decoration: none;
}
/* Pages on the left, contact on the right, split by a thin rule; contact is quieter. */
.site-footer__nav { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; font-size: 14px; }
.site-footer__group { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.site-footer__group--contact { padding-left: 24px; border-left: 1px solid #d5d3cc; }
.site-footer__nav a { color: #0b0b0a; font-weight: 500; text-decoration: none; }
.site-footer__group--contact a { color: #66645e; font-weight: 400; }
@media (max-width: 600px) {
  .site-footer__nav { flex-direction: column; align-items: flex-start; gap: 10px; }
  .site-footer__group--contact { padding-left: 0; border-left: 0; }
}
.site-footer__nav a:hover { color: #0b0b0a; text-decoration: underline; text-underline-offset: 0.2em; }
.site-footer__bottom p { margin: 0; max-width: 60em; }
