/* Page-level rules for the site, on top of tokens.css and site.css */
.skip { position: absolute; left: -999px; top: 0; background: var(--pine); color: var(--on-pine); padding: var(--space-2) var(--space-4); border-radius: var(--radius-md); z-index: 10; }
.skip:focus { left: var(--space-4); top: var(--space-4); }

main { padding-bottom: var(--space-6); }
.page-head { padding: var(--space-8) 0 var(--space-4); }
.page-title { font-family: var(--font-serif); font-weight: 500; font-size: 40px; line-height: 1.1; letter-spacing: -0.01em; margin: 0 0 var(--space-4); }
@media (max-width: 640px) { .page-title { font-size: 32px; } }
.page-head .ml-lead { font-size: 20px; line-height: 1.5; color: var(--ink-muted); margin: 0 0 var(--space-5); }
.page-head .ml-tag-row { margin-bottom: var(--space-5); }
.page-actions { margin: 0; }
.ml-kicker-inline { display: inline; padding: 0; border: 0; background: none; font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--pine); }
.page-head .ml-hero-eyebrow { margin: 0 0 var(--space-3); }

.ml-section:first-child { margin-top: var(--space-6); }
.ml-section .ml-list { max-width: var(--measure-body, 66ch); }
.ml-section > p:last-child { margin: var(--space-2) 0 0; }

/* Phone header: nav wraps under the name */
@media (max-width: 560px) {
  .ml-header { flex-wrap: wrap; gap: var(--space-3); }
  .ml-nav { gap: var(--space-4); }
}

/* Book block (STOS project page) */
.book { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: var(--space-6); align-items: start; }
.book-cover { width: 100%; height: auto; border-radius: var(--radius-sm); box-shadow: var(--shadow-float); }
.book-series { margin: 0 0 var(--space-2); font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--pine); }
.book-title { font-family: var(--font-serif); font-weight: 500; font-size: 32px; line-height: 1.1; margin: 0; }
.book-subtitle { font-family: var(--font-serif); font-style: italic; font-size: 20px; color: var(--ink-muted); margin: var(--space-2) 0 0; }
.book-byline { font-size: 15px; color: var(--ink-muted); margin: var(--space-2) 0 var(--space-5); }
.book-downloads { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-5); }
.book-meta { font-weight: 400; font-size: 13px; opacity: 0.75; margin-left: var(--space-1); }
@media (max-width: 640px) {
  .book { grid-template-columns: 1fr; gap: var(--space-5); }
  .book-cover { width: 160px; }
  .book-title { font-size: 28px; }
}
