@charset "UTF-8";
@font-face {
  font-family: "Monument";
  src: url("../type/ABCMonumentGrotesk-Black.woff");
  font-style: normal;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  text-decoration: none;
  color: black;
}

html {
  font-size: 0.7vw;
  --body: 1.9rem;
  --small: 1.4rem;
  --details: 1.2rem;
}
@media (max-width: 720px) {
  html {
    font-size: 6px;
    --small: 1.7rem;
    height: -webkit-fill-available;
  }
}

body {
  font-family: "Monument";
  font-size: 1.6rem;
  line-height: 1.15;
  scroll-behavior: smooth;
  transition: transform 0.5s ease-in-out;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@media (max-width: 720px) {
  body {
    min-height: 100vh;
    min-height: -webkit-fill-available;
  }
}
body.content {
  transform: translateX(-33%);
}
@media (max-width: 720px) {
  body.content {
    transform: translateX(-80%);
  }
}
body.gallery-open .gallery {
  display: block;
}

h1,
h2,
h3,
p,
nav a,
nav span {
  font-size: var(--body);
  font-weight: normal;
}

header {
  position: sticky;
  top: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 1em;
  padding: 1.25em;
  z-index: 2;
  transition: filter 0.25s ease-in-out;
}

.menu {
  font-size: var(--body);
  position: fixed;
  top: 0;
  right: 0;
  width: 70vw;
  height: 100vh;
  overflow-y: auto;
  background: white;
  z-index: 10;
  box-shadow: -10px 4px 11px 2px rgba(0, 0, 0, 0.25);
  padding: 1em;
  transition: transform 0.5s ease-in-out;
}
.menu-close {
  position: absolute;
  top: 1em;
  right: 1em;
}
.menu:not(.visible) {
  transform: translateX(110%);
}
@media (max-width: 720px) {
  .menu {
    display: block;
  }
}
.menu-trigger {
  font-size: var(--body);
  position: fixed;
  top: 1em;
  right: 1em;
  display: none;
}
@media (max-width: 720px) {
  .menu-trigger {
    display: block;
  }
}

.introduction {
  margin: 0.5em 0;
}

img {
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
  filter: blur(1rem);
}
img.loaded {
  opacity: 1;
  filter: blur(0);
}

nav {
  display: flex;
  flex-direction: row;
}
@media (max-width: 720px) {
  nav {
    display: none;
  }
}
nav.mobile {
  display: none;
}
@media (max-width: 720px) {
  nav.mobile {
    display: block;
  }
}
nav.mobile a {
  display: block;
}
nav a:not(:last-of-type):after {
  content: ", ";
  padding-right: 4px;
}
nav a:hover, nav a[aria-current] {
  text-decoration: underline;
  text-decoration-thickness: 0.2rem;
  text-underline-offset: 0.2rem;
}
nav a[aria-expanded=true] {
  text-decoration: underline;
  text-decoration-thickness: 0.2rem;
  text-underline-offset: 0.2rem;
}
nav span {
  display: block;
  margin-left: auto;
}

.video {
  max-width: 100%;
  width: 100%;
  display: inline-block;
}
.video:hover {
  cursor: pointer;
}
.video-wrap {
  position: relative;
  display: inline-block;
  max-height: 50%;
}
.video-wrap figcaption {
  position: absolute;
  width: 100%;
  left: 50%;
  transform: translateX(-50%);
  font-size: var(--body);
}
.video_controls {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.video-wrap:hover .video_controls {
  display: block;
}

.content-pane {
  width: 33%;
  height: 100vh;
  overflow-y: auto;
  background: yellow;
  position: fixed;
  top: 0;
  right: 0;
  transform: translateX(100%);
  padding: 1em;
  padding-bottom: 4em;
  font-size: var(--body);
  z-index: 20;
}
@media (max-width: 720px) {
  .content-pane {
    width: 80%;
  }
}
.content-pane[data-slug=projects] figure {
  padding: 0;
  padding-top: 1em;
}
.content-pane[data-slug=projects] figure figcaption {
  font-size: var(--small);
  margin-top: 0.5em;
}
.content-pane[data-slug=projects] figure:first-of-type {
  padding: 1em 0;
}
.content-pane[data-slug=projects] figure + figure {
  margin-top: -1em;
}
.content-pane-content {
  position: relative;
}
.content-pane_close:hover {
  cursor: pointer;
}
.content-pane-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.content-pane .details {
  margin-top: 1.1em;
}
.content-pane .details p,
.content-pane .details li {
  font-size: var(--small);
}
.content-pane .details ul {
  margin-left: 4em;
  list-style: none;
}
.content-pane address {
  font-style: normal;
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 1.1em 0 0 4em;
  position: absolute;
  width: 80%;
  bottom: 1em;
}
.content-pane address a:before {
  content: "● ";
}
.content-pane address p {
  text-indent: 0 !important;
  font-size: var(--small);
}
.content-pane .library-item {
  max-width: 50%;
  margin: 0 auto;
}
.content-pane p,
.content-pane ul li,
.content-pane ol li {
  font-size: var(--body);
}
.content-pane p {
  text-indent: 4em;
}
.content-pane p:first-of-type {
  text-indent: 0;
}
.content-pane p + p {
  text-indent: 4em;
}
.content-pane p a {
  text-decoration: underline;
  text-decoration-thickness: 0.2rem;
  text-underline-offset: 0.2rem;
}
.content-pane ul, .content-pane blockquote {
  margin: 1.1em 1.1em 1.1em 4em;
  list-style: none;
}
.content-pane .bio {
  margin-left: 4em;
  margin-top: 1.2em;
}
.content-pane .bio p {
  font-size: var(--small);
}
.content-pane .bio p:first-of-type {
  text-indent: 0;
}
.content-pane video {
  width: 100%;
  display: block;
  filter: grayscale(1);
  padding: 1em 0;
  mix-blend-mode: multiply;
}
.content-pane figure {
  padding: 1em 0;
  background: yellow;
}
.content-pane figure figcaption {
  font-size: var(--small);
  margin-top: 0.5em;
}
.content-pane figure + figure {
  padding-top: 0;
}
.content-pane figure.video video {
  max-width: 100%;
  display: block;
  filter: grayscale(1);
}
.content-pane figure.video + figure {
  margin-top: -1.25em;
}
.content-pane figure img {
  filter: grayscale(1);
  mix-blend-mode: multiply;
}
.content-pane figure:hover img {
  filter: grayscale(0);
  mix-blend-mode: initial;
}
.content-pane .video-wrap {
  background: yellow;
  width: 100%;
}
.content-pane .video-wrap + .image {
  padding-top: 0;
}
.content-pane .ref-details {
  display: flex;
  flex-direction: row;
  margin-bottom: 1em;
}
.content-pane .ref-details div:first-of-type {
  width: 4em;
}
.content-pane .ref-project {
  margin-top: 1.1em;
}
.content-pane .ref-project a {
  text-decoration: underline;
  text-decoration-thickness: 0.2rem;
  text-underline-offset: 0.2rem;
}

.title {
  text-transform: capitalize;
}

.selected {
  position: relative;
}
.selected figure {
  position: relative;
  display: table;
  vertical-align: middle;
}
.selected figure img figcaption {
  background: white;
  display: table-caption;
  caption-side: bottom;
}
.selected figure figcaption {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 0.5em 0 0.25em;
  background: white;
  font-size: var(--body);
}
.selected .images {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: wrap;
  counter-reset: image;
  max-width: 95%;
  margin: 0 auto;
}
.selected .images div {
  max-width: 100%;
  width: 100%;
  margin-left: -1.75%;
}
.selected .images div .col:last-of-type {
  margin-left: 3.5%;
}
@media (max-width: 720px) {
  .selected .images figure:last-of-type {
    width: 100%;
    max-width: calc(50% + 2em) !important;
    margin-left: 50% !important;
    margin-top: 8em !important;
  }
}
.selected .images figure:before {
  counter-increment: image;
  content: counter(image);
  display: block;
  padding-bottom: 0.5em;
  font-size: var(--body);
  text-align: center;
}
.selected .images figure[data-column=full] {
  max-width: 90%;
  margin: 0 auto;
}
.selected .images figure[data-column=half] {
  width: calc(50% - 0.5em);
}
@media (max-width: 720px) {
  .selected .images figure[data-column=half] {
    width: 100%;
    max-width: 90%;
    margin: 0 auto;
  }
}
.selected .images figure[data-column=third] {
  width: calc(33.3333% - 0.5em);
}
.selected .images figure[data-column=third] + [data-column=half] {
  margin-left: 16.6667%;
}
@media (max-width: 720px) {
  .selected .images figure[data-column=third] {
    width: 100%;
    max-width: 80%;
    margin: 0 auto;
  }
}
.selected .images figure.pad_top {
  padding-top: 12em;
}
.selected .images figure.pad_bottom {
  padding-bottom: 12em;
}
.selected .images div.cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 1em;
}
.selected .images div.cols.pad_top {
  padding-top: 6em;
}
.selected .images div.cols.pad_bottom {
  padding-bottom: 6em;
}
.selected .images div[data-column=full] {
  padding-top: 10em;
}
.selected .images div[data-column=full]:first-of-type {
  padding: 0;
}
.selected .images div[data-column=full] .caption {
  font-size: var(--body);
  margin: 0.5em 0;
  display: block;
}
.selected .images div[data-column=title] {
  padding-top: 6em;
  display: block;
  width: 100%;
}
.selected .images div[data-column=title] .caption {
  font-size: var(--body);
  margin: 0.5em 0;
  display: block;
  text-align: center;
}
.selected .images div[data-column=title] + .full {
  padding-top: 0.5em;
}
.selected .images div[data-column=third] {
  padding-top: 10em;
  padding-bottom: 1em;
  display: block;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 1em;
}
.selected .images div[data-column=third] .col {
  font-size: var(--body);
}
.selected .images div[data-column=third] .caption {
  font-size: var(--body);
  margin: 0.5em 0;
  display: block;
  column-count: 3;
}
.selected .images div[data-column=third] + .full {
  padding-top: 0.5em;
}

.overlay_close {
  display: none;
}
.overlay_close.visible {
  position: fixed;
  left: 33%;
  width: 66%;
  height: 100vh;
  background: transparent;
  z-index: 10;
  display: block;
}

main {
  position: fixed !important;
  top: 0;
  left: 0;
  padding: 8em 1.25em 1em 1.25em;
  scroll-behavior: smooth;
  height: 100vh;
  width: 100%;
  overflow-y: auto;
  z-index: 0;
}

.project {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 1em;
  grid-row-gap: 1em;
  margin-top: 1em;
}
.project-list article {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-column-gap: 1em;
  padding-bottom: 1.25em;
}
.project-list article .display {
  grid-column: span 2;
  display: flex;
  align-items: flex-end;
}
@media (max-width: 720px) {
  .project-list article .display {
    display: none;
  }
}
.project-list article figure {
  grid-column: span 2;
}
.project-list article .desc {
  font-size: var(--body);
  display: flex;
}
.project-list article .desc .project-header-tagline {
  font-size: var(--body);
  display: flex;
  padding-top: 0.5em;
}
@media (max-width: 720px) {
  .project-list article {
    grid-template-columns: 1fr;
  }
}
.project-list article .header {
  font-size: var(--body);
  letter-spacing: 0.01rem;
  margin-bottom: 1.1em;
}
.project-list article .header-area {
  justify-content: flex-end;
  display: none;
}
.project-list article .header span {
  background: white;
}
.project-list article .header span:last-of-type {
  font-size: var(--body);
}
.project-list article .details-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  font-size: var(--body);
}
@media (max-width: 720px) {
  .project-list article figure {
    padding-top: 0.5em;
  }
}
.project-list article figure img:nth-of-type(2) {
  display: none;
}
.project-list article figure:hover img:nth-of-type(1) {
  display: none;
}
.project-list article figure:hover img:nth-of-type(2) {
  display: block;
}
.project-header {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-column-gap: 0.5em;
  position: sticky;
  top: 0;
  z-index: 100;
  transition: filter 0.25s ease-in-out;
}
.project-header-tagline {
  font-size: var(--body);
  grid-column-start: 7;
  grid-column-end: 13;
  padding-right: 0.5em;
}
.project-header.blur {
  filter: blur(1rem);
}
.project-header.blur:hover h1 {
  filter: blur(0);
}
.project-header span {
  font-size: var(--body);
}
.project-header span.project-header-title {
  grid-column-start: 4;
  grid-column-end: 11;
}
.project-header span.project-header-details:before {
  content: "● ";
}
.project-footer {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 1em;
  position: relative;
  z-index: 5;
}
@media (max-width: 720px) {
  .project-footer {
    grid-template-columns: 1fr;
  }
}
.project-details {
  padding-top: 0.25em;
}
.project-details .row {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  font-size: var(--small);
}
.project-details .row-title {
  grid-column-start: 1;
  grid-column-end: 3;
}
.project-details .row-description {
  grid-column-start: 3;
  grid-column-end: 7;
  text-transform: capitalize;
}
.project-description {
  padding-top: 0.25em;
  font-size: var(--small);
}
@media (max-width: 720px) {
  .project-description {
    padding-top: 1.5em;
  }
}
.project-description p {
  font-size: var(--body);
}
.project-gallery {
  padding-top: 16em;
  padding-bottom: 0.75em;
  position: relative;
  z-index: 2;
  background: white;
  box-shadow: 5px -18px 15px 10px #ffffff;
  z-index: 110;
}
@media (max-width: 720px) {
  .project-gallery {
    margin-top: 4em;
  }
}
.project-gallery p {
  font-size: var(--small);
}
.project-gallery_inner {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-column-gap: 0.5em;
  grid-row-gap: 0.5em;
  padding-top: 0.5em;
}
.project-gallery figure {
  grid-column: span 2;
  height: 14.6rem;
  overflow-y: hidden;
  background-size: cover;
  background-position: left bottom;
}
.project-gallery figure.portrait {
  grid-column: span 1;
}

[data-template=archive],
[data-template=investigations] {
  padding-top: 10em;
}
[data-template=archive] .project-details,
[data-template=investigations] .project-details {
  border: none;
}

[data-template=projects] .project-list article[data-status=completed] figure figcaption {
  padding: 0.35em 0;
  padding-bottom: 0;
  font-size: var(--body);
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 1em;
}
[data-template=projects] .project-list article[data-status=completed] figure figcaption span.project-details {
  padding: 0;
  border: none;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}

[data-template=archive] a {
  display: block;
}
[data-template=archive] article[data-status=in-progress] {
  width: 100%;
  border-top: none;
  height: auto;
  padding: 0.15em 0;
  margin: 0;
}
[data-template=archive] footer {
  padding-top: 10em;
}
[data-template=archive] footer a {
  display: inline-block;
}
[data-template=archive] .archive-header {
  border-bottom: 2px solid;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-column-gap: 0.5em;
  font-size: var(--small);
}
[data-template=archive] .archive-title {
  grid-column: span 4;
}
[data-template=archive] .archive-year {
  grid-column: span 1;
}
@media (max-width: 720px) {
  [data-template=archive] .archive-year {
    grid-column: span 2;
  }
}
[data-template=archive] .archive-area {
  grid-column: span 1;
}
@media (max-width: 720px) {
  [data-template=archive] .archive-area {
    grid-column: span 2;
  }
}
[data-template=archive] .archive-materials {
  grid-column: span 5;
}
@media (max-width: 720px) {
  [data-template=archive] .archive-materials {
    grid-column: span 4;
  }
}
[data-template=archive] .archive_link {
  grid-column: span 1;
  text-align: right;
}
[data-template=archive] article {
  border-bottom: 2px solid;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-column-gap: 0.5em;
  padding: 0.1em 0 0.05em 0;
  font-size: var(--body);
}
[data-template=archive] article .archive-title {
  grid-column: span 4;
}
[data-template=archive] article .archive-year {
  grid-column: span 1;
}
[data-template=archive] article .archive-area {
  grid-column: span 1;
}
[data-template=archive] article .archive-materials {
  grid-column: span 5;
}

[data-template=project] .project {
  position: relative;
  width: 100%;
  min-height: 100vh;
}
@media (max-width: 720px) {
  [data-template=project] .project {
    min-height: 75vh;
  }
}
[data-template=project] .project figure {
  display: inline-block;
  vertical-align: middle;
}
[data-template=project] .project figure.library-item {
  max-width: 20rem;
}
[data-template=project] .project figure.two-col {
  width: 16.6666666666%;
}
[data-template=project] .project figure.three-col {
  width: 24.9999999999%;
}
[data-template=project] .project figure.four-col {
  width: 33.333333333%;
}
[data-template=project] .project figure.five-col {
  width: 41.6666666665%;
}
[data-template=project] .project figure.six-col {
  width: 50%;
}
[data-template=project] .project figure figcaption {
  padding-top: 0.6rem;
  display: flex;
  justify-content: center;
  width: 100%;
}
[data-template=project] .project figure figcaption .num.inline {
  margin-left: auto;
}

.status {
  text-transform: capitalize;
}

.project-overlay {
  position: fixed;
  top: 0;
  left: 0;
  background: white;
  width: 100vw;
  height: 100vh;
  z-index: 100;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.project-overlay:not(.visible) {
  display: none;
}
.project-overlay_close {
  position: absolute;
  top: 1.5em;
  right: 1.5em;
}
.project-overlay_close:hover {
  opacity: 0.25;
  cursor: pointer;
}
.project-overlay_nums {
  position: absolute;
  top: 1.5em;
  left: 1.5em;
}
.project-overlay-title {
  position: absolute;
  top: 1.5em;
  left: 50%;
  transform: translateX(-50%);
}
.project-overlay figure {
  max-width: 80%;
  width: 100%;
  height: 82vh;
  background-size: cover;
}
.project-overlay figure.portrait {
  max-width: 32%;
}
.project-overlay figure:not(:first-of-type) {
  display: none;
}

sup {
  line-height: 1;
  font-size: 10px;
}
@media (max-width: 720px) {
  sup {
    font-size: 6px;
  }
}

article[data-status=in-progress] {
  padding: 0.25em 0 0.35em;
  float: left;
  font-size: var(--small);
}
article[data-status=in-progress] figure {
  background: #aaa;
}
article[data-status=in-progress] figure img {
  filter: grayscale(1);
  mix-blend-mode: screen;
  transition: all 1s ease-in-out;
}
article[data-status=in-progress] figure figcaption {
  background: white;
  padding-top: 0.35em;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
article[data-status=in-progress] figure:hover img {
  filter: grayscale(0);
  mix-blend-mode: initial;
}
article[data-status=in-progress] .progress-details {
  grid-column: span 1;
}
article[data-status=in-progress] .progress-images {
  grid-column: span 2;
}
article[data-status=in-progress] .progress-images figure {
  width: 100%;
  height: 35rem;
  background-size: cover;
  background-color: rgba(255, 255, 255, 0.25);
  background-blend-mode: screen;
  filter: grayscale(1);
}
article[data-status=in-progress] .progress-images figure figcaption {
  padding-top: 0.5em;
}
article[data-status=in-progress] .progress-images figure:hover {
  background-blend-mode: initial;
  filter: grayscale(0);
}
article[data-status=in-progress] .progress-images figure.portrait {
  grid-column: span 2;
}
article .project-details {
  font-size: var(--body);
}
article .project-details sup {
  font-size: 1rem;
}
[data-template=projects] .project-list,
[data-template=project] .project-list {
  display: grid;
}
[data-template=projects] .project-list a,
[data-template=project] .project-list a {
  display: inline-block;
  float: left;
}
[data-template=projects] .project-list a.content-trigger,
[data-template=project] .project-list a.content-trigger {
  width: calc(50% - 0.375em);
}
[data-template=projects] .project-list a.content-trigger + .content-trigger,
[data-template=project] .project-list a.content-trigger + .content-trigger {
  margin-left: 0.75em;
}
[data-template=projects] .in-progress,
[data-template=project] .in-progress {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-column-gap: 0.5em;
}
@media (max-width: 720px) {
  [data-template=projects] .in-progress,
[data-template=project] .in-progress {
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 1.5em;
  }
}

figure img {
  max-width: 100%;
  display: block;
}

.count {
  font-size: var(--body);
  background: white;
  mix-blend-mode: multiply;
}

.reference-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 0.75em;
  border-top: 2px solid;
}
.reference-list {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-column-gap: 0.75em;
  grid-row-gap: 0.75em;
  padding: 2em 0 4em;
  counter-reset: nums;
}
.reference-list a {
  display: block;
  grid-column: span 2;
}
@media (max-width: 720px) {
  .reference-list a {
    grid-column: span 6;
  }
}
.reference-list a.portrait {
  grid-column: span 1;
}
@media (max-width: 720px) {
  .reference-list a.portrait {
    grid-column: span 3;
  }
}
.reference-list figure {
  height: 16rem;
  background-size: cover;
  background-position: center;
  position: relative;
  transition: opacity 0.5s ease-in;
  opacity: 0;
}
.reference-list figure.loaded {
  opacity: 1;
}
@media (max-width: 720px) {
  .reference-list figure {
    height: 19rem;
  }
}
.reference-list figure figcaption {
  position: absolute;
  bottom: -0.5em;
  left: 50%;
  transform: translateX(-50%);
  padding-top: 0.5rem;
}
.reference-list figure figcaption:before {
  counter-increment: nums;
  content: counter(nums, upper-roman);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.gallery {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: white;
  z-index: 1000;
  display: none;
}
.gallery_close {
  position: fixed;
  top: 1em;
  right: 1.25em;
  z-index: 100;
  font-size: var(--body);
}
.gallery_close:hover {
  cursor: pointer;
  opacity: 0.25;
}
.gallery .prev, .gallery .next {
  position: fixed;
  width: 40px;
  top: 50%;
  left: 18px;
  height: 40px;
  border-radius: 20px;
  z-index: 99;
  font-size: 2.4rem;
  transform: translateY(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.25s ease-in-out;
}
.gallery .prev:hover, .gallery .next:hover {
  cursor: pointer;
  box-shadow: 6px 2px 20px 0px rgba(0, 0, 0, 0.15);
}
.gallery .next {
  right: 18px;
  left: auto;
}
.gallery .count {
  position: fixed;
  top: 1em;
  left: 1.25em;
  z-index: 100;
  font-size: var(--body);
}
.gallery.animate .img {
  transition: filter 0.15s ease-in;
}
.gallery figure {
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
}
.gallery figure:hover {
  cursor: pointer;
}
.gallery figure.portrait .img {
  max-width: 40vw;
  top: 50%;
  left: 50%;
  transform: translateX(-50%, -50%);
}
.gallery figure.animate .img {
  transition: filter 0.15s ease-in;
}
.gallery figure figcaption {
  position: fixed;
  top: -4em;
  left: 50%;
  transform: translateX(-50%);
}
.gallery figure .img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  max-width: 82.5%;
  height: 95vh;
  transform: translate(-50%, -50%);
  background-position: center;
  background-size: cover;
  opacity: 0;
}
.gallery figure .img.loaded {
  opacity: 1;
}
@media (max-width: 670px) {
  .gallery figure .img {
    max-width: calc(100% - 3em);
    margin: 0 auto;
  }
}

footer {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 0.75em;
  padding-top: 10em;
}
footer span {
  font-size: var(--small);
}
footer div {
  padding-top: 0.25em;
  position: relative;
}
footer div.single {
  font-size: var(--small);
  border: none;
}
footer div.single span:first-of-type {
  grid-column: span 2;
}
footer div .back-to-top {
  position: absolute;
  bottom: 0;
  right: 0;
  border: none;
  font-size: var(--small);
}
@media (max-width: 720px) {
  footer div .back-to-top {
    display: none;
  }
}
footer div .row {
  border: none;
  font-size: var(--small);
  padding: 0;
}
footer div .row .credit {
  padding-left: 2em;
}
footer div .row.single {
  font-size: var(--small);
  border: none;
}
footer div .row.single span {
  grid-column: span 2;
}
footer div .row.single span:first-of-type {
  grid-column: span 2;
}
footer div .row span {
  grid-column: span 5;
}
footer div .row span:first-of-type {
  grid-column: span 1;
}

[data-template=project] footer {
  padding-top: 10em;
}

.no-link {
  pointer-events: none;
  color: lightgray;
}

.blur-strong {
  filter: blur(12px);
}

.blur {
  filter: blur(8px) !important;
}

.blur-mid {
  filter: blur(4px);
}

.blur-soft {
  filter: blur(2px);
}

.no-blur {
  filter: blur(0) !important;
}

.status {
  text-transform: capitalize;
}

[data-type=archive] main {
  background: rgb(204, 204, 204);
  background: linear-gradient(180deg, rgb(204, 204, 204) 0%, rgb(247, 247, 247) 75%);
}

[data-type=home] footer {
  padding-top: 4em;
}

.projects-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 1em;
  padding-top: 16em;
}
.projects-list p {
  font-size: var(--body);
}
.projects-list ol {
  counter-reset: item;
  list-style-type: none;
}
.projects-list ol li {
  display: block;
  font-size: var(--body);
  text-indent: 0.75em;
  position: relative;
}
.projects-list ol li a:hover {
  text-decoration: underline;
  text-decoration-thickness: 0.2rem;
  text-underline-offset: 0.2rem;
}
.projects-list ol li .num {
  width: 12.5rem;
  display: inline-block;
}
.projects-list ol li:before {
  content: counter(item) "  ";
  counter-increment: item;
  position: absolute;
  margin-left: -1.5em;
}

/*# sourceMappingURL=style.css.map */