/* ============================================================
   Layout · container, grid, section padding, reveal helpers
   ============================================================ */

.container {
  max-width: var(--max-content);
  margin: 0 auto;
  padding: 0 40px;
}
@media (max-width: 720px) { .container { padding: 0 24px; } }

.section {
  padding: var(--space-11) 0;
}
.section-snug { padding: var(--space-10) 0; }
.section-tight { padding: var(--space-9) 0; }
@media (max-width: 720px) {
  .section, .section-snug, .section-tight { padding: var(--space-9) 0; }
}

.section--alt   { background: var(--canvas-alt); }
.section--tint  { background: var(--canvas-tint); }
.section--ink   { background: var(--canvas-ink); color: var(--ink-on-dark); }
.section--ink p { color: rgba(251, 246, 241, 0.74); }
.section--ink .eyebrow { color: rgba(251, 246, 241, 0.6); }
.section--ink h1, .section--ink h2, .section--ink h3, .section--ink .display-1, .section--ink .display-2, .section--ink .display-hero { color: var(--ink-on-dark); }

/* Section header · Roman numeral + label + rule */
.section-head {
  display: flex;
  align-items: baseline;
  gap: var(--space-5);
  padding-bottom: var(--space-5);
  margin-bottom: var(--space-8);
  border-bottom: 1px solid var(--line);
}
.section--ink .section-head { border-bottom-color: var(--line-on-dark); }
.section-head__numeral {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-2);
}
.section--ink .section-head__numeral { color: rgba(251, 246, 241, 0.6); }
.section-head__label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink);
}
.section--ink .section-head__label { color: var(--ink-on-dark); }

/* Two-column hairline grid */
.grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-8);
}
.grid-2-1 {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: var(--space-8);
}
.grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-6);
}
@media (max-width: 860px) {
  .grid-2, .grid-2-1, .grid-3 { grid-template-columns: 1fr; gap: var(--space-7); }
}

/* Reading width */
.reading {
  max-width: var(--max-reading);
  margin: 0 auto;
}

/* Reveal-on-scroll */
.reveal {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity var(--dur-med) var(--ease-out), transform var(--dur-med) var(--ease-out);
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}
@media print {
  .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  .nav { position: static; }
  .section, .section-snug, .section-tight { padding: 40px 0; }
  .hero { min-height: auto; }
}