/* Plain inner pages (privacy policy, 404): the home page's look, without the
   3D hero. Loaded after style.css, which supplies the colours, fonts, nav and
   buttons. */
.subpage { background: var(--bg); min-height: 100vh; display: flex; flex-direction: column; }
.subpage .page { flex: 1; } /* keeps the footer at the bottom on short pages */
.subpage .nav { position: sticky; }

.page { padding-block: clamp(3rem, 7vw, 6rem) clamp(4rem, 9vw, 8rem); min-height: 60vh; }
.page__wrap { max-width: 860px; }
.page__title {
  font-size: clamp(2.4rem, 5vw, 4.2rem); font-weight: 500; line-height: 1;
  letter-spacing: -.045em; margin-bottom: 1.25rem;
}
.page__meta { font: 500 .78rem/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-bottom: 3rem; }
.page__lead { font-size: clamp(1.05rem, 1.4vw, 1.25rem); color: var(--muted); max-width: 40rem; }

/* breadcrumbs */
.crumbs ol { display: flex; flex-wrap: wrap; gap: .5rem; font: 500 .78rem/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-bottom: 1.75rem; }
.crumbs li + li::before { content: "/"; margin-right: .5rem; opacity: .5; }
.crumbs a { text-decoration: none; }
.crumbs a:hover { color: var(--accent-ink); }

/* long-form text */
.prose { font-size: 1.05rem; line-height: 1.75; }
.prose h2 { font-size: clamp(1.35rem, 2vw, 1.7rem); font-weight: 500; letter-spacing: -.02em; line-height: 1.2; margin: 2.75rem 0 .9rem; }
.prose p + p, .prose ul + p, .prose p + ul { margin-top: 1rem; }
.prose ul { list-style: disc; padding-left: 1.25rem; display: grid; gap: .6rem; }
.prose a { color: var(--accent-ink); }
.prose strong { font-weight: 600; }
.prose__actions { margin-top: 2.5rem; }

/* 404 */
.nf__links { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2.5rem; }

/* footer */
.page-foot { background: var(--ink); color: var(--muted-dark); font-size: .9rem; }
.page-foot__grid { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; padding-block: 1.75rem; }
.page-foot nav { display: flex; flex-wrap: wrap; gap: 1.25rem; }
.page-foot a { text-decoration: none; color: var(--bg); }
.page-foot a:hover { color: var(--accent-2); }

@media (max-width: 768px) {
  .subpage .nav__links { display: none; }
}