.page-top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 24px 32px;
  max-width: 1100px;
  margin: 0 auto;
}
.logo {
  font-size: var(--t-micro);
  letter-spacing: var(--t-micro-tracking);
  text-transform: uppercase;
  color: var(--c-muted);
  text-decoration: none;
}
.logo:hover { color: var(--c-fg); }

.strip {
  display: flex;
  gap: 18px;
  font-family: var(--font-mono);
  font-size: var(--t-micro);
  color: var(--c-muted);
}
.strip-num { color: var(--c-fg); font-variant-numeric: tabular-nums; }

.concept {
  max-width: 720px;
  margin: 0 auto;
  padding: 48px 32px 96px;
}
.concept .display {
  font-size: var(--t-display);
  line-height: var(--t-display-lh);
  letter-spacing: var(--t-display-tracking);
  font-weight: 400;
  margin-bottom: 48px;
}
.concept p {
  font-size: var(--t-body-lg);
  line-height: var(--t-body-lg-lh);
  margin: 0 0 32px;
  color: var(--c-fg);
}
.concept figure {
  margin: 32px 0 48px;
  border-radius: var(--radius-base);
  overflow: hidden;
  background: var(--c-card);
}
.concept figure img {
  display: block;
  width: 100%;
  height: auto;
}
.entry-links {
  margin-top: 64px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.entry-links a {
  font-size: var(--t-h2);
  color: var(--c-fg);
  text-decoration: none;
  letter-spacing: var(--t-h2-tracking);
}
.entry-links a:hover { color: var(--c-orange); }

.quiet-link {
  display: block;
  margin-top: 40px;
  color: var(--c-muted);
  font-size: var(--t-caption);
  text-decoration: none;
}
.quiet-link:hover { color: var(--c-fg); }

@media (max-width: 720px) {
  .page-top { flex-direction: column; align-items: flex-start; gap: 12px; padding: 16px 20px; }
  .strip { flex-wrap: wrap; gap: 10px; }
  .concept { padding: 24px 20px 64px; }
  .concept .display { font-size: 40px; }
  .entry-links a { font-size: var(--t-h3); }
}