/* 404 - ma być spokojna, nie przepraszająca. Duża typografia, cztery drogi wyjścia. */
.nf { padding-block: clamp(7rem, 16vh, 12rem) var(--section); }
.nf__code { color: var(--purple); }
.nf__h { margin-top: clamp(1.25rem, 3vw, 2rem); max-width: 18ch; }
.nf__lead { margin-top: clamp(1.25rem, 3vw, 1.75rem); max-width: 46ch; }

.nf__links {
  margin-top: clamp(2.5rem, 6vw, 4rem);
  border-top: 1px solid var(--hairline);
  max-width: 44rem;
}
.nf__link {
  display: flex;
  align-items: baseline;
  gap: 1.25rem;
  padding-block: clamp(1rem, 2.2vw, 1.4rem);
  border-bottom: 1px solid var(--hairline);
  font: 300 clamp(1.2rem, 1rem + 1.1vw, 1.7rem)/1.3 var(--sans);
  transition: color var(--dur) var(--ease), padding-left var(--dur) var(--ease);
}
.nf__link:hover { color: var(--purple); padding-left: 0.5rem; }
.nf__n { font: 500 0.62rem/1 var(--sans); letter-spacing: 0.18em; color: var(--muted); }

.nf__call { margin-top: clamp(2rem, 4vw, 3rem); font-size: 0.95rem; color: var(--muted); }
.nf__call a { border-bottom: 1px solid var(--hairline); padding-bottom: 2px; color: var(--ink); }
.nf__call a:hover { color: var(--purple); border-color: var(--purple); }
