/* Lampwright v2 · secondary pages (privacy notice, 404). Loaded after styles.css. */

.page { padding: 96px 0 128px; }
.page-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 48px; align-items: start; }
.page-side { position: sticky; top: calc(var(--header-h) + 32px); }
.page-meta { margin-top: 12px; font-size: 14px; color: var(--slate); }

.prose { max-width: 680px; }
.prose h1 { font-size: clamp(2.125rem, 1.35rem + 2.4vw, 3.25rem); line-height: 1.06; letter-spacing: -0.02em; font-variation-settings: "opsz" 60; margin-bottom: 24px; }
.prose-lede { font-size: 20px; line-height: 1.55; color: var(--night); padding-bottom: 32px; border-bottom: 1px solid var(--haze); }
.prose h2 { font-size: 24px; line-height: 1.2; margin: 48px 0 12px; }
.prose p, .prose li { color: var(--body); }
.prose p + p, .prose ul + p, .prose p + ul { margin-top: 12px; }
.prose ul { padding: 0; }
.prose li { position: relative; padding: 4px 0 4px 24px; }
.prose li::before { content: ""; position: absolute; left: 4px; top: 15px; width: 8px; height: 1px; background: var(--night); }
.prose a { color: var(--night); text-underline-offset: 3px; text-decoration-thickness: 1px; }

/* 404 */
.nf { padding: 128px 0; }
.nf-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 72px; align-items: center; }
.nf-plate {
  position: relative; aspect-ratio: 1; max-width: 360px; width: 100%;
  display: grid; place-items: center;
  background-color: var(--white); border: 1px solid var(--rule); border-radius: 16px;
  background-image: linear-gradient(var(--grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size: 20px 20px; background-position: -1px -1px;
}
.nf-mark { width: 37%; height: auto; color: var(--night); overflow: visible; }
/* Nothing lit here: the flame is out, drawn as a dashed outline */
.nf-unlit { fill: none; stroke: var(--slate); stroke-width: 1; stroke-dasharray: 3 2.4; stroke-linecap: round; }
.pilot.pilot-off, .js .pilot.pilot-off.is-lit { background: transparent; box-shadow: inset 0 0 0 1px #8C97A8; }
.nf-coord { position: absolute; top: 16px; left: 20px; font: 500 12px/1 var(--mono); letter-spacing: .08em; color: var(--slate); }
.nf h1 { font-size: clamp(2.5rem, 1.5rem + 3.2vw, 4.5rem); line-height: 1.02; letter-spacing: -0.025em; font-variation-settings: "opsz" 72; margin-bottom: 24px; }
.nf-line { font-size: 20px; line-height: 1.55; color: var(--body); max-width: 30em; margin-bottom: 40px; }
.nf-line a { color: var(--night); text-underline-offset: 3px; text-decoration-thickness: 1px; }

@media (max-width: 960px) {
  .page { padding: 72px 0 96px; }
  .page-grid { grid-template-columns: 1fr; gap: 16px; }
  .page-side { position: static; }
  .nf { padding: 72px 0 96px; }
  .nf-grid { grid-template-columns: 1fr; gap: 48px; }
  .nf-plate { max-width: 240px; }
}
@media (max-width: 640px) {
  .page { padding: 48px 0 72px; }
  .prose-lede, .nf-line { font-size: 17px; }
  .prose h2 { margin-top: 40px; }
  .nf { padding: 48px 0 72px; }
  .nf-plate { max-width: 180px; }
}
