/* press.css - the press kit page (/press/), over site.css: wider, a fact sheet beside the copy, galleries of thumbnails
   (the 1x frames scaled up pixelated) that link to the full files. Made for tools/presskit/page.mjs. */
body.press main { max-width: 76rem; }
.press h1 span { font: 600 1.1rem/1 var(--pix); color: var(--gd); vertical-align: middle; margin-left: .4rem; letter-spacing: .04em; text-transform: uppercase; }
.press .rule { color: var(--gr3); font-size: .95rem; border-left: 3px solid var(--r2); padding-left: .7rem; }
.kit { display: grid; gap: 0 2.2rem; }
.facts { background: var(--d1); border: 1px solid var(--gr0); border-top: 3px solid var(--r3); border-radius: 3px; padding: .2rem 1rem 1rem; align-self: start; }
.facts h2 { margin-top: .9rem; border: 0; }
.facts dl { margin: 0; font-size: .95rem; }
.facts dt { font: 600 .8rem/1.2 var(--pix); color: var(--gd); text-transform: uppercase; letter-spacing: .06em; margin-top: .7rem; }
.facts dd { margin: .1rem 0 0; color: var(--w); overflow-wrap: anywhere; }
.btn { display: inline-block; font: 600 1rem/1 var(--pix); color: var(--w); background: var(--r2); border: 1px solid var(--r3); border-radius: 3px; padding: .75rem 1rem; text-decoration: none; min-height: 44px; }
.btn:hover { background: var(--r3); color: var(--w); }
.dlall { margin: 1.1rem 0 .4rem; }
.toc { list-style: none; padding: 0; margin: .8rem 0 0; display: flex; flex-wrap: wrap; gap: .1rem .9rem; font: .95rem/1.9 var(--pix); }
.toc a { color: var(--bn1); }
.sz { color: var(--gr3); font-size: .85em; white-space: nowrap; }
details summary { cursor: pointer; font: 600 .95rem/2 var(--pix); color: var(--bn1); }
.videos li { margin: .4rem 0; }
section { margin-top: .5rem; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); gap: 1.4rem 1.2rem; margin: 1rem 0; }
.shot { margin: 0; }
.shot img, .shot video { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; background: var(--k); image-rendering: pixelated; border: 1px solid var(--gr0); border-radius: 2px; }
.shot figcaption { font-size: .9rem; line-height: 1.45; margin-top: .45rem; color: var(--gr3); }
.shot figcaption strong { color: var(--w); }
.dl { font: .88rem/1.7 var(--pix); }
.dl a { white-space: nowrap; }
.posters { grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); align-items: start; }
.poster img { aspect-ratio: auto; }
.walls .shot img { aspect-ratio: auto; image-rendering: auto; }
.logos { grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); }
.logo { margin: 0; }
.logo img { display: block; max-width: 100%; height: auto; image-rendering: pixelated; margin: 0 auto; }
.logo a { display: flex; align-items: center; justify-content: center; min-height: 9rem; padding: 1rem; border-radius: 3px; border: 1px solid var(--gr0); }
.logo.on-dark a { background: var(--k); }
.logo.on-light a { background: #eee4cc; }
.logo figcaption { font-size: .9rem; margin-top: .4rem; color: var(--gr3); }
.files td.n, .files th.n { text-align: right; white-space: nowrap; }
.names { columns: 2 12rem; padding-left: 1.1rem; }
h2.sub { font-size: 1.05rem; }
@media (min-width: 60rem) {
  .kit { grid-template-columns: 19rem 1fr; }
  .facts { position: sticky; top: 1rem; grid-row: 1 / span 2; }
}
@media (max-width: 59.99rem) { .copy { order: -1; } .kit { display: flex; flex-direction: column; } .facts { margin-top: 1.5rem; } }