/* Slab: cold grey ground, condensed uppercase labels, sticky sidebar, works in two columns at natural size. */
.theme-slab {
  --bg: #e6e7e6; --bg-2: #dcdedd; --ink: #1c1e20; --ink-2: #66696b; --rule: #c6c8c7; --tile: #dcdedd; --field: #fff; --white: #f4f5f4;
  --body: "Source Serif 4", "Iowan Old Style", Georgia, serif;
  --ui: "Archivo Narrow", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
}
.theme-slab .label, .theme-slab .meta, .theme-slab .btn, .theme-slab .f label, .theme-slab .site-hdr nav a, .theme-slab .langs a { letter-spacing: .08em; }
.theme-slab .label { font-size: 13px; }
.theme-slab .btn { font-size: 14px; font-weight: 600; }
.theme-slab .site-hdr { display: none; }
.theme-slab .site { display: grid; grid-template-columns: 300px 1fr; min-height: 100vh; }
.theme-slab .site-side { position: sticky; top: 0; align-self: start; height: 100vh; overflow: hidden; padding: 28px 24px; display: flex; flex-direction: column; gap: 24px; border-right: 1px solid var(--rule); }
.theme-slab .site-side .name { font-family: var(--ui); font-size: 26px; text-transform: uppercase; letter-spacing: .06em; line-height: 1; font-weight: 600; }
.theme-slab .site-side .name small { display: block; font-size: 12px; letter-spacing: .14em; font-weight: 400; color: var(--ink-2); margin-top: 8px; }
.theme-slab .site-side nav { display: grid; gap: 8px; }
.theme-slab .site-side nav a { display: flex; justify-content: space-between; border-bottom: 1px solid var(--rule); padding-bottom: 6px; font-family: var(--ui); text-transform: uppercase; letter-spacing: .08em; font-size: 13px; font-weight: 500; }
.theme-slab .badge { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px; background: var(--ink); color: var(--white); font-size: 11px; border-radius: 10px; }
.theme-slab .site-side .short { font-size: 15px; max-width: 30ch; }
.theme-slab .site-side .short p { margin: 0 0 .8em; }
.theme-slab .site-side .studio { margin: 0; max-width: 180px; }
.theme-slab .site-side figcaption { font-family: var(--ui); font-size: 11px; letter-spacing: .06em; color: var(--ink-2); margin-top: 4px; }
.theme-slab .site-side .foot { margin-top: auto; font-family: var(--ui); font-size: 12px; letter-spacing: .06em; color: var(--ink-2); display: flex; justify-content: space-between; align-items: flex-end; }
.theme-slab main { padding: 28px 24px 40px; display: flex; flex-direction: column; }
.theme-slab .flash { order: 0; }
.theme-slab .gallery { order: 1; }
.theme-slab .bio { order: 2; max-width: 62ch; padding-top: 48px; margin-top: 40px; border-top: 1px solid var(--rule); }
.theme-slab .bio-side h1, .theme-slab .bio-side .studio, .theme-slab .gal-head { display: none; }
.theme-slab .bio .facts { margin: 0 0 20px; }
.theme-slab .bio-text > .label { display: block; margin-bottom: 14px; }
.theme-slab .grid { columns: 2; column-gap: 24px; }
.theme-slab .tile { break-inside: avoid; margin-bottom: 40px; }
.theme-slab .tile .cap .t { font-size: 19px; }
.theme-slab .tile:hover .cap .t { text-decoration: underline; text-underline-offset: 4px; }
.theme-slab .tile .cap .p { font-family: var(--ui); text-transform: uppercase; letter-spacing: .08em; font-size: 13px; font-weight: 500; }
.theme-slab .work, .theme-slab .inq { padding-top: 8px; }
.theme-slab .work h1, .theme-slab .inq h1 { font-size: 30px; }
.theme-slab input, .theme-slab textarea { background: var(--white); }
@media (max-width: 820px) {
  .theme-slab .site-hdr { display: flex; position: sticky; top: 0; background: var(--bg); padding: 12px 16px; border-bottom: 1px solid var(--rule); z-index: 3; }
  .theme-slab .site-hdr .name { font-family: var(--ui); text-transform: uppercase; letter-spacing: .1em; font-size: 13px; font-weight: 500; }
  .theme-slab .site { grid-template-columns: 1fr; }
  .theme-slab .site-side { display: none; }
  .theme-slab main { padding: 0 0 40px; }
  .theme-slab .grid { columns: 1; }
  .theme-slab .tile { margin-bottom: 36px; }
  .theme-slab .tile .cap { padding-inline: 16px; }
  .theme-slab .bio, .theme-slab .work, .theme-slab .inq, .theme-slab .done, .theme-slab .flash { margin-inline: 16px; }
  .theme-slab .bio { padding-top: 32px; margin-top: 0; }
}