.page {
  flex: 1 0 auto;
  width: 100%;
  max-width: var(--content-width);
  margin-inline: auto;
  padding: var(--space-l) var(--space-s) var(--space-xl);
}

.footer {
  border-top: 1px solid var(--color-border);
  padding: var(--space-m) var(--space-s);
  text-align: center;
  font-size: var(--step--1);
}

.footer__line + .footer__line {
  margin-top: var(--space-3xs);
}

.footer__muted {
  color: var(--color-muted);
}

.footer__rights {
  margin-top: var(--space-2xs);
  color: var(--color-muted);
  font-size: var(--step--1);
  max-width: 46ch;
  margin-inline: auto;
}

.footer__mail {
  font-family: var(--font-mono);
}

.section + .section {
  margin-top: var(--space-l);
}

.section__title {
  font-size: var(--step-2);
  padding-bottom: var(--space-xs);
  margin-bottom: var(--space-m);
  text-align: center;
}

.section__title::after {
  content: "";
  display: block;
  width: min(30vw, 100%);
  height: 2px;
  margin: var(--space-xs) auto 0;
  background: linear-gradient(
    90deg,
    transparent,
    var(--color-accent) 22%,
    var(--color-focus) 50%,
    var(--color-accent) 78%,
    transparent
  );
}

.section__lead {
  max-width: var(--measure);
  margin: calc(-1 * var(--space-2xs)) auto var(--space-m);
  color: var(--color-muted);
  text-align: center;
}

.resume__header {
  margin-bottom: var(--space-l);
}

.resume__eyebrow {
  margin-bottom: var(--space-3xs);
  color: var(--color-accent-text);
  font-size: var(--step--1);
  text-transform: uppercase;
  letter-spacing: 0.14em;
}

.resume__title {
  font-size: var(--step-4);
}

.resume__summary {
  margin-top: var(--space-2xs);
  max-width: var(--measure);
  color: var(--color-muted);
  font-size: var(--step-1);
}

.resume__total {
  margin-top: var(--space-2xs);
  color: var(--color-accent-text);
  font-family: var(--font-mono);
  font-size: var(--step--1);
}

.is-notfound .page {
  display: grid;
  place-content: center;
  gap: var(--space-2xs);
  min-height: calc(100dvh - 12rem);
  text-align: center;
}

.notfound__code {
  font-family: var(--font-mono);
  font-size: clamp(4rem, 2rem + 12vw, 9rem);
  font-weight: 650;
  line-height: 1;
  letter-spacing: -0.04em;
  background: linear-gradient(
    104deg,
    var(--color-text) 8%,
    var(--color-focus) 46%,
    var(--color-accent) 92%
  );
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  animation: rise var(--duration-slow) var(--ease-out) both;
}

.notfound__title {
  margin-top: var(--space-2xs);
  font-size: var(--step-2);
  animation: rise var(--duration-slow) var(--ease-out) 80ms both;
}

.notfound__text {
  margin-inline: auto;
  max-width: 40ch;
  color: var(--color-muted);
  text-wrap: balance;
  animation: rise var(--duration-slow) var(--ease-out) 160ms both;
}

.is-home .page {
  display: flex;
  flex-direction: column;
  gap: var(--space-l);
  align-items: center;
  text-align: center;
}