/* Avery Intelligence: what every page shares (27 Oct 2026). The home page's header and footer, its type (Geist) and its
   sheen, in three looks set on <body>: t-dark (the home page), t-light (Advisory, Sprints, the essay and the plain pages)
   and t-cream (About us, which keeps its paper and ink). On the light pages it also brings the home page's look to the
   Sprints page's building blocks (.fv), which Advisory and the essay use too. */
@font-face { font-family: 'Geist'; font-style: normal; font-weight: 400; font-display: swap; src: url(/pro-assets/geist-latin-400-normal.B40WzpMT.woff2) format('woff2'); }
@font-face { font-family: 'Geist'; font-style: normal; font-weight: 500; font-display: swap; src: url(/pro-assets/geist-latin-500-normal.CTWBw9NS.woff2) format('woff2'); }
@font-face { font-family: 'Geist'; font-style: normal; font-weight: 600; font-display: swap; src: url(/pro-assets/geist-latin-600-normal.CSETrqM2.woff2) format('woff2'); }
@font-face { font-family: 'Geist'; font-style: normal; font-weight: 700; font-display: swap; src: url(/pro-assets/geist-latin-700-normal.CFi8mLqe.woff2) format('woff2'); }

:root, .t-light {
  --s-ground: #ffffff; --s-ink: #09090b; --s-ink-2: #3f3f46; --s-mute: #6b6b76; --s-line: rgba(9, 9, 11, .09);
  --s-glass: rgba(255, 255, 255, .82); --s-call: rgba(9, 9, 11, .2); --s-call-hover: rgba(9, 9, 11, .05);
  --s-blue: #2f7cf6; --s-lime: #c4f04a; --s-lime-ink: #5b8a00;
  --s-sheen: linear-gradient(90deg, #09090b 0%, #09090b 36%, #2f7cf6 46%, #6c9e0c 54%, #09090b 64%, #09090b 100%);   /* a band of light passing over ink */
  --s-sans: 'Geist', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --s-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.t-dark {
  --s-ground: #05060a; --s-ink: #f4f4f5; --s-ink-2: #c9c9d1; --s-mute: #8e8e99; --s-line: rgba(255, 255, 255, .10);
  --s-glass: rgba(5, 6, 10, .86); --s-call: rgba(255, 255, 255, .22); --s-call-hover: rgba(255, 255, 255, .06);
  --s-blue: #3b93ff; --s-lime-ink: #c4f04a;
  --s-sheen: linear-gradient(90deg, #fff 0%, #9cc9ff 25%, #c4f04a 50%, #fff 75%, #fff 100%);
  color-scheme: dark;
}
.t-cream {
  --s-ground: #EFE8DA; --s-ink: #2A2219; --s-ink-2: rgba(42, 34, 25, .85); --s-mute: rgba(42, 34, 25, .70); --s-line: rgba(42, 34, 25, .16);
  --s-glass: rgba(239, 232, 218, .88); --s-call: rgba(42, 34, 25, .3); --s-call-hover: rgba(42, 34, 25, .06);
}

/* the light pages' ground: white, Geist, and nothing the browser adds (the Sprints page was built on this reset) */
.t-light { margin: 0; background: var(--s-ground); color: var(--s-ink); font-family: var(--s-sans); line-height: 1.6; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: clip; }
:where(.t-light) *, :where(.t-light) *::before, :where(.t-light) *::after { box-sizing: border-box; margin: 0; padding: 0; }
:where(.t-light) a { color: inherit; }
:where(.t-light) button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
:where(.t-light) :focus-visible { outline: 2px solid var(--s-blue); outline-offset: 3px; border-radius: 4px; }
.t-light ::selection { background: rgba(47, 124, 246, .16); }
html:has(.t-light) { scroll-behavior: smooth; scroll-padding-top: 88px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.site-wrap { width: 100%; max-width: 1240px; margin: 0 auto; padding-inline: 40px; box-sizing: border-box; }

/* ---------- the header: the mark and the name, the four pages, a call; on phones the pages fold into a menu ---------- */
.site-head { position: sticky; top: 0; z-index: 50; font-family: var(--s-sans); border-bottom: 1px solid transparent; transition: background-color .3s ease, border-color .3s ease; }
.site-head.scrolled, .site-head.open { background: var(--s-glass); -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); border-bottom-color: var(--s-line); }
.site-head-in { display: flex; align-items: center; gap: 26px; padding-block: 22px; }
.site-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--s-ink); text-decoration: none; font-size: 17px; font-weight: 600; letter-spacing: -0.01em; white-space: nowrap; }
.site-mark { width: 24px; height: 24px; display: block; flex: none; fill: currentColor; }
.site-nav { display: flex; align-items: center; gap: 26px; margin-left: auto; font-size: 15px; }
.site-nav a, .site-call { white-space: nowrap; text-decoration: none; }
.site-nav a { color: var(--s-mute); transition: color .2s ease; }
.site-nav a:hover, .site-nav a:focus-visible, .site-nav a[aria-current="page"] { color: var(--s-ink); }
.site-call { color: var(--s-ink); font-size: 15px; border: 1px solid var(--s-call); padding: 7px 15px; border-radius: 999px; line-height: 1.5; transition: border-color .2s ease, background-color .2s ease; }
.site-call:hover { border-color: var(--s-ink); background: var(--s-call-hover); }
.site-menu { display: none; position: relative; width: 38px; height: 38px; margin-right: -9px; border-radius: 10px; color: var(--s-ink); background: none; border: 0; cursor: pointer; }
.site-menu i { position: absolute; left: 10px; right: 10px; height: 1.5px; border-radius: 2px; background: currentColor; transition: transform .25s ease, top .25s ease; }
.site-menu i:first-of-type { top: 15px; } .site-menu i:last-of-type { top: 22px; }
.site-head.open .site-menu i:first-of-type { top: 18.5px; transform: rotate(45deg); }
.site-head.open .site-menu i:last-of-type { top: 18.5px; transform: rotate(-45deg); }

/* ---------- the footer: one quiet line ---------- */
.site-foot { font-family: var(--s-sans); font-size: 13px; color: var(--s-mute); }
.site-foot-in { display: flex; gap: 18px; flex-wrap: wrap; padding-block: 28px 30px; }
.site-foot a { color: var(--s-mute); text-decoration: none; }
.site-foot a:hover { color: var(--s-ink); text-decoration: underline; text-underline-offset: 3px; }
.t-light .site-foot, .t-cream .site-foot { border-top: 1px solid var(--s-line); }
.site-foot-note { padding-block: 0 30px; margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--s-mute); }

/* the home page's moving gradient on a headline's last words */
.site-fast {
  background: var(--s-sheen); background-size: 300% 100%; -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: site-sheen 6s linear infinite;
}
@keyframes site-sheen { from { background-position: 100% 0; } to { background-position: -200% 0; } }

@media (max-width: 760px) {
  .site-wrap { padding-inline: 20px; }
  .site-head-in { gap: 14px; padding-block: 16px; }
  .site-menu { display: block; }
  .site-call { margin-left: auto; font-size: 14px; padding: 6px 13px; }
  .site-nav {
    display: none; position: absolute; top: 100%; left: 0; right: 0; margin: 0; flex-direction: column; align-items: stretch; gap: 0;
    padding: 6px 20px 18px; background: var(--s-ground); border-bottom: 1px solid var(--s-line); font-size: 19px;
  }
  .site-head.open { background: var(--s-ground); }   /* solid while the menu is open, so the page doesn't show through */
  .site-head.open .site-nav { display: flex; }
  .site-nav a { padding: 11px 0; border-top: 1px solid var(--s-line); color: var(--s-ink); }
  .site-nav a:first-child { border-top: 0; }
  .site-nav a[aria-current="page"] { color: var(--s-blue); }
}
@media (max-width: 380px) { .site-brand { font-size: 15.5px; gap: 8px; } .site-mark { width: 22px; height: 22px; } }

/* ---------- the home page's look on the Sprints page's building blocks (Sprints, Advisory, the essay) ---------- */
/* what the Sprints page's export took from humfrid.com's stylesheet: section spacing and heading sizes */
:where(.fv) section { padding: clamp(80px, 12vw, 140px) 48px; position: relative; }
:where(.fv) h2 { font-size: clamp(2.5rem, 6vw, 4rem); font-weight: 400; line-height: 1.1; letter-spacing: -.02em; margin-bottom: 24px; }
:where(.fv) h3 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 400; line-height: 1.2; letter-spacing: -.01em; margin-bottom: 16px; }
.t-light .fv { padding-top: 56px; background: transparent; }
/* the home page's type: medium weight, tight */
.t-light .fv main h1, .t-light .fv main h2 { font-weight: 500 !important; letter-spacing: -.038em; line-height: 1.04; }
.t-light .fv main h3 { font-weight: 500 !important; letter-spacing: -.022em; }
/* its dot grid and blue light behind the first screen, fading out as the page goes on */
.t-light .fv.ql::before, .t-light .fv.lite-top::before {
  content: ""; position: absolute; z-index: 0; top: -100px; left: 50%; width: 100vw; height: 900px; transform: translateX(-50%); pointer-events: none;
  background-image: radial-gradient(circle at 72% 30%, rgba(47, 124, 246, .10), transparent 42%), radial-gradient(rgba(9, 9, 11, .075) 1px, transparent 1.3px);
  background-size: 100% 100%, 28px 28px;
  -webkit-mask-image: linear-gradient(#000 45%, transparent); mask-image: linear-gradient(#000 45%, transparent);
}
.t-light .fv.lite-top { position: relative; isolation: isolate; }
.t-light .fv.lite-top > main { position: relative; z-index: 1; }
/* its rounded cards */
.t-light .ql-method-grid, .t-light .ql-shift-grid { border-radius: 16px; overflow: hidden; }
.t-light .fv-eyebrow { border: 1px solid var(--s-line); background: rgba(255, 255, 255, .7); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.t-light .fv-btn { transition: transform .2s ease, background-color .2s ease, border-color .2s ease; }
.t-light .fv-btn:hover { transform: translateY(-1px); }
.t-light .fv-btn-ghost:hover { border-color: #a1a1aa; }

@media (prefers-reduced-motion: reduce) {
  .site-fast { animation: none; }
  .site-head, .site-nav a, .site-call, .site-menu i, .t-light .fv-btn { transition: none; }
}
@media print { .site-head, .site-foot { display: none !important; } }