html { scroll-padding-block-start: 7.5rem; }

.pf-progress {
  position: fixed;
  inset: 0 0 auto 0;
  block-size: 2px;
  z-index: 120;
  background: linear-gradient(90deg, var(--nv-color-accent), var(--nv-color-accent-hover, var(--nv-color-accent)));
  transform: scaleX(0);
  transform-origin: left;
  pointer-events: none;
}

.pf-sr {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.pf-hero .hero__title { max-inline-size: 14ch; }
.pf-hero .hero__title .nv-text-lit--accent { display: block; font-size: 0.62em; letter-spacing: var(--nv-letter-spacing-tight); }
.pf-facts { align-self: stretch; margin-block-start: var(--nv-space-2); grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pf-stage { display: grid; padding: var(--nv-space-8); }
.pf-hero .hero__copy > *, .pf-stage { animation: nv-arrive var(--nv-duration-slower) var(--nv-ease-entrance) both; }
.pf-hero .hero__copy > :nth-child(2) { animation-delay: var(--nv-stagger); }
.pf-hero .hero__copy > :nth-child(3) { animation-delay: calc(var(--nv-stagger) * 2); }
.pf-hero .hero__copy > :nth-child(4) { animation-delay: calc(var(--nv-stagger) * 3); }
.pf-hero .hero__copy > :nth-child(5), .pf-stage { animation-delay: calc(var(--nv-stagger) * 4); }

.pf-terminal { inline-size: 100%; }
.pf-terminal .nv-window__title { text-align: start; font-family: var(--nv-font-family-mono); }
.pf-terminal__body { padding: var(--nv-space-4); display: flex; flex-direction: column; gap: var(--nv-space-3); font-family: var(--nv-font-family-mono); font-size: var(--nv-font-size-sm); }
.pf-terminal__log {
  block-size: 15rem;
  overflow: auto;
  padding-inline-end: var(--nv-space-2);
  scrollbar-width: thin;
  overscroll-behavior: contain;
}
.pf-terminal__log p { margin: 0 0 var(--nv-space-3); color: var(--nv-color-text-primary); line-height: 1.7; white-space: pre-line; }
.pf-terminal__log b { color: var(--nv-color-accent); font-weight: var(--nv-font-weight-semibold); }
.pf-terminal__log em { color: var(--nv-color-success, var(--nv-color-accent)); font-style: normal; }
.pf-terminal__form {
  display: flex;
  align-items: center;
  gap: var(--nv-space-2);
  padding-block-start: var(--nv-space-3);
  border-block-start: var(--nv-border-width) solid var(--nv-color-border-subtle);
}
.pf-terminal__form label { color: var(--nv-color-accent); }
.pf-terminal__form input {
  flex: 1;
  min-inline-size: 0;
  padding: var(--nv-space-1) 0;
  border: 0;
  background: transparent;
  color: var(--nv-color-text-primary);
  font: inherit;
  caret-color: var(--nv-color-accent);
  outline: none;
}
.pf-terminal__form:focus-within { border-block-start-color: var(--nv-color-accent); }
.pf-terminal__keys .nv-button { font-family: var(--nv-font-family-mono); }

.pf-jump-wrap {
  position: sticky;
  inset-block-start: 4.1rem;
  z-index: 40;
  padding-block: var(--nv-space-3);
  pointer-events: none;
}
.pf-jump { pointer-events: auto; display: flex; inline-size: fit-content; margin-inline: auto; backdrop-filter: blur(14px); }
.pf-jump .nv-nav__item { white-space: nowrap; }

.pf-about { display: grid; gap: var(--nv-space-5); grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: start; }
.pf-principles { display: grid; gap: var(--nv-space-3); list-style: none; margin: 0; padding: 0; }

.pf-stack { display: flex; flex-direction: column; gap: var(--nv-space-4); padding: var(--nv-space-8); }
.pf-tabs { align-self: flex-start; }
.pf-tabs .nv-nav__item { gap: var(--nv-space-2); }
.pf-tabs__icon { display: inline-flex; }
.pf-tools { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); gap: var(--nv-space-3); list-style: none; margin: 0; padding: 0; }

.pf-focus .nv-card { block-size: 100%; }
.pf-list { flex-direction: column; align-items: flex-start; }

.pf-project__body { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--nv-space-6); align-items: start; }
.pf-project p { margin: 0; max-inline-size: 65ch; }
.pf-project ul { list-style: none; margin: 0; padding: 0; }

.pf-layers { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr)); gap: var(--nv-space-4); }
.pf-layers .nv-card { block-size: 100%; }
.pf-layers ul { list-style: none; margin: 0; padding: 0; }
.pf-code { margin-block-start: var(--nv-space-5); }
.pf-code .nv-window__body { padding: var(--nv-space-4); }
.pf-code__pre {
  margin: 0;
  overflow-x: auto;
  font-family: var(--nv-font-family-mono);
  font-size: var(--nv-font-size-sm);
  line-height: 1.8;
  color: var(--nv-color-text-secondary);
}
.pf-note { display: flex; align-items: center; gap: var(--nv-space-2); margin-block-start: var(--nv-space-4); }
.pf-note a { color: var(--nv-color-accent); }

.pf-faq .nv-disclosure__body { display: flex; flex-direction: column; gap: var(--nv-space-3); padding: 0 var(--nv-space-4) var(--nv-space-4); }
.pf-faq p { margin: 0; }

.pf-contact { padding-block: var(--nv-space-12); }
.pf-contact__actions { justify-content: center; }
.pf-status { min-block-size: 1.5em; margin: 0; }

.pf-hero .nv-stack, .pf-hero ul { min-inline-size: 0; }

@media (max-width: 64rem) {
  .pf-about { grid-template-columns: minmax(0, 1fr); }
  .pf-hero .hero__title { max-inline-size: none; }
}
@media (max-width: 48rem) {
  .pf-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pf-stage, .pf-stack { padding: var(--nv-space-4); }
  .pf-project__body { grid-template-columns: minmax(0, 1fr); gap: var(--nv-space-4); }
  .pf-jump-wrap { inset-block-start: 3.6rem; }
  .pf-jump { inline-size: 100%; }
  .pf-tabs { align-self: stretch; }
  .pf-terminal__log { block-size: 13rem; }
}
@media (prefers-reduced-motion: reduce) {
  .pf-hero .hero__copy > *, .pf-stage { animation: none; }
}

.pf-focus { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 48rem) { .pf-focus { grid-template-columns: minmax(0, 1fr); } }

.pf-order { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: var(--nv-space-5); margin-block-start: var(--nv-space-5); align-items: start; }
.pf-order .pf-list { flex-direction: column; align-items: flex-start; }
.pf-order p { margin: 0; }
@media (max-width: 64rem) { .pf-order { grid-template-columns: minmax(0, 1fr); } }