/* ==========================================================================
 * layout.css — page sections + header structure (shared across pages)
 * ========================================================================== */

section{
  border-bottom:var(--b-thick);
  padding:64px 32px;
  position:relative;
  /* Sticky nav is ~66px tall on desktop; offset anchor jumps so the
     section heading lands below it. Tablet/phone overrides in home.css. */
  scroll-margin-top:80px;
}
.section-inner{max-width:1180px;margin:0 auto}
.section-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  margin-bottom:32px;gap:24px;flex-wrap:wrap;
}
.section-num{
  font-family:var(--ff-pixel);font-size:48px;line-height:1;color:var(--ink);
  background:var(--accent-2);padding:0 12px 4px;border:var(--b);
  box-shadow:4px 4px 0 0 var(--ink);
}
.section-title{font-size:48px;font-weight:700;letter-spacing:-.03em;line-height:1;margin:0}
.section-sub{font-family:var(--ff-mono);font-size:13px;color:var(--muted);max-width:420px}

/* dark-mode rebalance: section-num sits on yellow accent — keep ink black */
[data-theme="dark"] .section-num{color:#0e0d0a}

/* utility row */
.row{display:flex;gap:12px;flex-wrap:wrap}