/* Layout for the small pages the site build emits beside the two home pages:
   /privacy/, /ignore/, and the 404. One column of
   reading text under the wordmark, in the same tokens and type as the rest of
   the site. Nothing here is page-specific; the build's templates only drop
   content into .utility. */
.utility{max-width:720px;margin:0 auto;padding:88px var(--gutter) 96px;position:relative;z-index:1}
.utility .brand{font-size:32px;display:inline-block;margin-bottom:64px}
.utility .label{display:block;margin-bottom:16px}
.utility h1{font-size:40px;line-height:1.15;letter-spacing:var(--track-display);margin-bottom:24px}
.utility h2{font-size:24px;letter-spacing:var(--track-display);margin:48px 0 12px}
.utility p,.utility li{font-size:18px;line-height:1.6;color:var(--ink-2)}
.utility p+p{margin-top:16px}
.utility ul{padding-left:20px;margin-top:8px}
.utility li+li{margin-top:8px}
.utility a:not(.brand):not(.btn){border-bottom:1px solid var(--accent);padding-bottom:1px}
.utility .cta{display:flex;gap:16px;flex-wrap:wrap;margin-top:40px}
.utility .cta .btn{border-bottom:none}
.utility .colophon{margin-top:96px}
.utility .status{padding:24px 28px;border:1px solid var(--field-border);background:var(--field);border-radius:4px;margin:32px 0}
.utility .status p{margin:0}
.utility .status p+p{margin-top:8px}
.utility .updated{font-size:14px;color:var(--gray);margin-top:48px}
@media (max-width:640px){
  .utility{padding-top:48px}
  .utility .brand{margin-bottom:40px}
  .utility h1{font-size:32px}
}