/* now/page.css — page-specific layout for the /now page.
   Depends on styles.css (the shared design system). */

.now-page { padding-block: clamp(3rem, 9vw, 6rem); }

.now-head { margin-bottom: clamp(2rem, 5vw, 3rem); }
.now-head .display { margin-bottom: 1rem; }
.now-updated {
  font-family: var(--font-mono); font-size: .78rem; letter-spacing: .04em;
  color: var(--ink-3);
}

/* ---- Snapshot meta strip -------------------------------------------------- */
.now-meta {
  display: flex; flex-wrap: wrap; gap: .6rem .5rem;
  margin-top: 1.4rem;
}
.now-meta .badge { font-size: .68rem; }

/* ---- Sectioned body ------------------------------------------------------- */
.now-sections { display: grid; gap: clamp(2.2rem, 5vw, 3.4rem); }

.now-block {
  display: grid;
  grid-template-columns: minmax(8.5rem, 12rem) 1fr;
  gap: clamp(1rem, 4vw, 3rem);
  padding-top: clamp(1.6rem, 4vw, 2.4rem);
  border-top: 1px solid var(--line);
}
.now-block:first-child { border-top: 0; padding-top: 0; }

.now-block-label {
  font-family: var(--font-mono); font-weight: 500;
  font-size: .76rem; letter-spacing: .18em; text-transform: uppercase;
  color: var(--ink-2);
  display: flex; align-items: baseline; gap: .55em;
  padding-top: .55rem; /* optically align with first prose line */
}
.now-block-mark { color: var(--accent); font-size: 1em; }

.now-block .prose { font-size: 1.16rem; }
.now-block .prose p + p { margin-top: 1.1em; }
.now-block .prose em { font-style: italic; color: var(--ink); }

.now-reading-line {
  display: inline-flex; align-items: center; gap: .55em; flex-wrap: wrap;
  margin-top: 1.1rem;
  font-family: var(--font-reading); font-size: 1.08rem;
}
.now-reading-line .badge { font-size: .64rem; }
.now-reading-line em { font-style: italic; }

@media (max-width: 680px) {
  .now-block { grid-template-columns: 1fr; gap: .9rem; }
  .now-block-label { padding-top: 0; }
}

.now-links { margin-top: clamp(2.6rem, 6vw, 3.6rem); }

.now-footnote {
  font-family: var(--font-mono); font-size: .72rem; letter-spacing: .02em;
  line-height: 1.6; margin-top: clamp(2.2rem, 5vw, 3rem);
  padding-top: var(--sp-3); border-top: 1px solid var(--line-2);
  max-width: 48ch;
}
