/* The Hackers in the Loop header, copied by studio/publish/site.py from the site's own CSS. */
@font-face {
  font-family: "Inter Tight";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/fonts/inter-tight-latin-wght-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/fonts/inter-latin-wght-normal.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2");
}
.v2-header {
  --carbon: #111315;
  --paper: #f4f2ea;
  --white: #fff;
  --signal: #ff553d;
  --signal-deep: #c8321e;
  --graphite: #555b58;
  --alloy: #aeb3b0;
  --fog: #d8dcd9;
  --font-display: "Inter Tight", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-text: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", Menlo, Monaco, monospace;
  --page-gutter: clamp(1.25rem, 4vw, 4rem);
  --content-width: 88rem;
  --section-space: clamp(4rem, 7vw, 7rem);
 --v2-width: 1240px; }
.v2-header { font-family: var(--font-text); color: var(--carbon); line-height: 1.5; position: relative !important; }
.v2-header *, .v2-header *::before, .v2-header *::after { box-sizing: border-box; }
.v2-header a { color: inherit; text-decoration: none; }
.v2-header img { display: block; }
.v2-wrap { width: min(100%, var(--v2-width)); margin-inline: auto; padding-inline: clamp(1.25rem, 4vw, 3.5rem); }
.v2-header { position: sticky; top: 0; z-index: 50; background: var(--paper); border-bottom: 1px solid var(--fog); }
.v2-header-inner { display: flex; gap: 2rem; align-items: center; min-height: 92px; }
.v2-brand { display: flex; gap: .65rem; align-items: center; flex-shrink: 0; }
.v2-brand img { width: 52px; height: 52px; }
.v2-brand span { font: 750 1.125rem/1.1 var(--font-display); letter-spacing: -.02em; }
.v2-nav { display: flex; align-items: center; gap: 1.5rem; margin-left: auto; }
.v2-nav a { font-size: .9375rem; padding-block: .65rem; border-bottom: 2px solid transparent; }
.v2-nav a[aria-current=page] { border-color: var(--signal-deep); }
.v2-nav a:hover { color: var(--signal-deep); }
.v2-menu-toggle, .v2-nav .v2-mobile-connect { display: none; }
.v2-header-connect .v2-button { font-size: .875rem; padding: .7rem .95rem; }
.v2-button { display: inline-flex; justify-content: center; align-items: center; min-height: 46px; border: 1px solid var(--carbon); padding: .85rem 1.25rem; border-radius: .2rem; font-weight: 600; font-size: 1rem; line-height: 1.4; transition: background .15s; }
.v2-button:hover { background: var(--fog); }
.v2-button--primary { background: var(--signal); color: var(--carbon); border-color: var(--signal); }
.v2-button--primary:hover { background: #fb705c; border-color: #fb705c; }
@media (max-width: 1080px) { .v2-header-inner { gap: 1.5rem; } .v2-header-connect { display: none; } }
@media (max-width: 760px) {
  .v2-header-inner { min-height: 76px; flex-wrap: wrap; justify-content: space-between; gap: 0; }
  .v2-brand img { width: 44px; height: 44px; }
  .v2-brand span { font-size: 1rem; }
  .v2-menu-toggle { display: inline-flex; align-items: center; gap: 1.5rem; background: transparent; border: 1px solid var(--fog); border-radius: .2rem; padding: .6rem .85rem; min-height: 44px; }
  .v2-menu-toggle span { font-size: 1.3rem; line-height: 1; }
  .v2-nav { display: none; flex-basis: 100%; margin: 0; padding-block: .5rem 1rem; border-top: 1px solid var(--fog); }
  .v2-nav .v2-mobile-connect { display: block; flex-basis: 100%; font-weight: 600; color: var(--signal-deep); }
  .v2-nav.is-open { display: flex; gap: .25rem 1.5rem; flex-wrap: wrap; }
}
.bar .home { display: none; }
