:root {
  --gutter: 1rem;
  --cell-border-radius: 1.3rem;
  --border-radius: 0.8rem;
  --border-width: 0.08rem;
  --cell-border-width: 0.05rem;
  --pill-padding: 0.6rem;
  --pill-height:1.8rem;
  --pill-shadow:0.18rem 0.18rem 0.45rem rgba(0, 0, 0, 0.3);
  --strip-height:3.8rem;
  --small-type:0.65rem;
  --category-selector-margin:0.3rem;
  --gray:#505050;
  --dot-width:1.5rem;
  --transition-duration:0.2s; }

@font-face {
  font-family: 'Nimbus';
  src: url(/assets/NimbusSanL-Reg-webfont-b65569846913700c232cb7a270617a647b7a5d0fd432637465a9b232441f46f4.woff) format("woff");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: 'Nimbus';
  src: url(/assets/NimbusSanL-RegIta-webfont-d8c36c02ecffa72cf087e220b28458aed3245e6da454bd880112c9a73774983a.woff) format("woff");
  font-weight: 400;
  font-style: italic;
  font-stretch: normal; }

html, body {
  padding: 0;
  margin: 0; }

html {
  font-size: 24px; }

body {
  font-family: 'Nimbus', 'Helvetica', 'Arial', sans-serif;
  font-size: 1rem;
  color: #000; }

button {
  font-family: 'Arial', sans-serif;
  background: transparent;
  border: none;
  appearance: none;
  font-size: 1rem; }

header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--gutter);
  height: var(--strip-height);
  box-sizing: border-box;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100; }

a {
  text-decoration: none;
  color: #000;
  appearance: none; }

p {
  margin: 0 0 1em 0; }
  p:last-child {
    margin-bottom: 0; }

h1, h2 {
  font-weight: 400;
  font-size: 1rem;
  text-align: center;
  padding: 0;
  text-transform: uppercase; }
  h1 span.preserve, h2 span.preserve {
    text-transform: none; }

h1 {
  text-align: center;
  grid-column: span 12;
  margin: calc(1.2*var(--gutter)) auto 0 auto;
  max-width: 60%;
  pointer-events: none; }

h2 {
  margin: 0; }

h2#related_projects_heading {
  height: var(--strip-height);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: calc(-1*var(--gutter)) 0;
  grid-column: span 12; }

#information_close {
  background-color: var(--gray);
  color: #fff;
  display: none;
  z-index: 1000; }

#logotype {
  text-transform: uppercase;
  position: absolute;
  top: var(--gutter);
  left: 50%;
  transform: translateX(-50%);
  z-index: 100; }

#case_studies_selector, #home_link {
  position: fixed;
  top: var(--gutter);
  z-index: 100; }

#home_link {
  display: flex; }
  #home_link a {
    margin-right: var(--gutter); }

#case_studies_selector, #home_link {
  left: var(--gutter); }

.pill {
  background: #fff;
  box-shadow: var(--pill-shadow);
  border-radius: var(--border-radius);
  padding: 0 var(--pill-padding);
  text-transform: uppercase;
  display: flex;
  line-height: 1;
  align-items: center;
  height: var(--pill-height); }

footer {
  height: var(--strip-height);
  display: flex;
  text-transform: uppercase;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--gutter);
  border-top: var(--border-width) solid #000;
  position: relative;
  z-index: 1;
  margin-top: var(--gutter); }

#footer_logotype {
  text-align: center; }

#address {
  text-align: right; }

#contact {
  display: flex; }
  #contact a {
    margin-left: var(--gutter); }
  #contact img {
    height: 1.2rem;
    width: auto; }

main {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-gap: var(--gutter);
  align-items: flex-start;
  justify-content: flex-start; }

img {
  display: block;
  width: 100%; }

ul {
  padding: 0;
  margin: 0;
  list-style: none; }

li {
  padding: 0;
  margin: 0; }

@media (max-width: 1750px) {
  html {
    font-size: 20px; }
  h1 {
    max-width: 40%; } }

@media (max-width: 1440px) {
  h1 {
    max-width: 35%; } }

@media (max-width: 1280px) {
  html {
    font-size: 16px; }
  h1 {
    max-width: 30%; } }

@media (max-width: 768px) {
  :root {
    --gutter: 0.9rem; }
  html {
    font-size: 4.9vw; }
  main {
    display: block; }
  header {
    margin-bottom: calc(0.5*var(--gutter));
    height: auto;
    position: relative; }
  #information_close, #information_open {
    border-radius: var(--pill-height);
    width: var(--pill-height);
    padding: 0;
    color: transparent;
    overflow: hidden;
    background-size: 90%;
    background-repeat: no-repeat;
    background-position: center; }
  #information_open {
    background-image: url(/assets/info-e686bad15a2e9a96324b03aa26fa5942cf9fdeaefd5c5cc1e3486eb09442f255.svg); }
  #information_close {
    background-image: url(/assets/close-bca5f5f66c01a1e7e587a3848ab098297f8a1ce851273d0bd97ef76d51daf1e4.svg); }
  h1 {
    max-width: 100%;
    padding: 0 var(--gutter);
    margin: 0 auto var(--gutter) auto; }
  footer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: var(--gutter);
    padding-top: var(--gutter);
    padding-bottom: calc(2*var(--gutter));
    height: auto; }
  #contact {
    justify-content: flex-start; }
    #contact a {
      width: auto;
      margin-left: 0;
      margin-right: var(--gutter);
      display: inline-block; }
  #footer_logotype, #address {
    text-align: left; } }

#homepage_slideshow {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  grid-column: span 12;
  z-index: 2; }

#homepage_slideshow_positioner {
  position: absolute;
  top: 0;
  left: 5vw;
  width: 90vw;
  height: 100%;
  display: flex; }
  #homepage_slideshow_positioner a, #homepage_slideshow_positioner button {
    width: 100%;
    min-width: 100%;
    height: 100%;
    overflow: hidden;
    display: block;
    position: relative;
    appearance: none;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent; }
  #homepage_slideshow_positioner img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; }

#homepage_pagination {
  position: fixed;
  z-index: 100;
  bottom: var(--gutter);
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center; }

.homepage_page {
  width: var(--dot-width);
  height: var(--dot-width);
  border-radius: var(--dot-width);
  border: 0;
  padding: 0;
  margin: calc(0.25*var(--dot-width));
  display: block;
  background: var(--gray);
  color: transparent;
  overflow: hidden;
  box-shadow: inset 0.15rem 0.23rem 0.2rem #000; }

@media (max-width: 768px) {
  #homepage_slideshow, #homepage_slideshow_positioner {
    position: static;
    width: auto;
    height: auto; }
  #homepage_slideshow_positioner {
    display: block; }
    #homepage_slideshow_positioner a, #homepage_slideshow_positioner button {
      height: 100vw; }
  #homepage_pagination {
    display: none; } }

#case_studies_selector {
  white-space: nowrap; }
  #case_studies_selector ul {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: flex-start; }
  #case_studies_selector li {
    margin-bottom: var(--category-selector-margin); }
  #case_studies_selector:not(.open) li:not(.selected) {
    display: none; }
  #case_studies_selector.open li:not(.selected) a {
    background-color: var(--gray);
    color: #fff; }

.case_study {
  grid-column: span 6;
  margin-bottom: calc(-1*var(--gutter)); }
  .case_study:nth-child(even) .project_category {
    padding-left: var(--gutter); }
  .case_study:nth-child(odd) .project_year {
    padding-right: var(--gutter); }

figure {
  padding: 0;
  margin: 0; }
  figure img, figure video {
    display: block;
    width: 100%; }

figcaption {
  height: var(--strip-height);
  padding: 0;
  margin: 0;
  display: flex;
  justify-content: space-between;
  align-items: center; }

.project_year, .project_category, .project_desktop_name, .project_mobile_name {
  text-transform: uppercase; }
  .project_year span.preserve, .project_category span.preserve, .project_desktop_name span.preserve, .project_mobile_name span.preserve {
    text-transform: none; }

.project_year, .project_category {
  font-size: var(--small-type); }

@media (max-width: 768px) {
  .case_study:nth-child(even) .project_category {
    padding-left: 0; }
  .case_study:nth-child(odd) .project_year {
    padding-right: 0; } }

#project_name {
  z-index: 48;
  height: 0;
  margin-bottom: calc(1.5*var(--gutter)); }
  #project_name.invert {
    color: #fff; }

#hero {
  grid-column: span 12;
  margin-top: calc(-1*var(--strip-height)); }
  #hero video {
    display: block;
    width: 100%; }

.columns_12 {
  grid-column: span 12; }

.columns_6 {
  grid-column: span 6; }

.columns_4 {
  grid-column: span 4; }

.columns_3 {
  grid-column: span 3; }

.cell.image.inset {
  padding: var(--gutter); }

.cell.rounded img, .cell.rounded video {
  box-shadow: calc(0.2*var(--gutter)) calc(0.2*var(--gutter)) calc(0.5*var(--gutter)) rgba(0, 0, 0, 0.3);
  border: var(--cell-border-width) solid #000; }

.cell.rounded.columns_12 img, .cell.rounded.columns_12 video {
  border-radius: var(--cell-border-radius); }

.cell.rounded.columns_6 img, .cell.rounded.columns_6 video {
  border-radius: calc(0.5 * var(--cell-border-radius)); }

.cell.rounded.columns_4 img, .cell.rounded.columns_4 video {
  border-radius: calc(0.333 * var(--cell-border-radius)); }

.cell.rounded.columns_3 img, .cell.rounded.columns_3 video {
  border-radius: calc(0.25 * var(--cell-border-radius)); }

.cell.video {
  padding: 0 0 100% 0;
  position: relative; }
  .cell.video video {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover; }

.related_project {
  grid-column: span 3; }

.related_project_name {
  padding: var(--gutter);
  text-align: center;
  font-size: var(--small-type); }

.project_mobile_name {
  display: none; }

#project_info .info_section {
  border-top: 0;
  padding-top: 0; }
  #project_info .info_section .info_left section {
    padding-top: 0; }

@media (max-width: 768px) {
  #project_name {
    height: auto; }
  #hero {
    margin-top: 0;
    margin-bottom: var(--gutter); }
  .cell {
    margin-bottom: var(--gutter); }
  .project_desktop_name {
    display: none; }
  figcaption {
    flex-wrap: wrap;
    margin: 0;
    padding: var(--gutter);
    height: auto; }
  .project_mobile_name {
    margin-top: calc(0.5*var(--gutter)); }
  .case_study:nth-child(2n) .project_year {
    padding: 0; }
  .case_study:nth-child(2n + 1) .project_category {
    padding: 0; }
  .project_mobile_name {
    display: block;
    min-width: 100%; } }

body.info_to_open #info {
  display: block; }

body.info_open {
  overflow: hidden; }
  body.info_open #information_close {
    display: block; }
  body.info_open #information_open {
    display: none; }
  body.info_open #info {
    overflow: auto;
    opacity: 1; }

#project_info {
  z-index: 45;
  position: static;
  display: block;
  opacity: 1;
  grid-column: span 12;
  padding-top: var(--gutter);
  border-top: var(--border-width) solid #000; }
  #project_info .info_section:last-child {
    border-bottom: 0; }
    #project_info .info_section:last-child section {
      margin-bottom: 0; }
    #project_info .info_section:last-child:not(:first-child) {
      margin-top: var(--gutter); }
  #project_info .info_left {
    grid-column: 3/8; }
  #project_info .info_right {
    grid-column: 8/13; }

.info {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  background-color: rgba(255, 255, 255, 0.92);
  z-index: 50;
  padding-top: var(--strip-height);
  display: none;
  opacity: 0;
  transition: opacity var(--transition-duration) ease; }
  .info ul {
    list-style: none;
    margin: 0;
    padding: 0; }
  .info li {
    padding: 0;
    margin: 0; }

.info_section {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  border-top: var(--border-width) solid #000;
  padding: var(--gutter) 0 0 0;
  gap: 0 var(--gutter); }
  .info_section section {
    display: grid;
    align-items: flex-start;
    margin-bottom: var(--gutter); }
  .info_section h2 {
    margin: 0;
    height: auto;
    text-align: left; }
  .info_section .content {
    display: flex;
    flex-direction: column; }
    .info_section .content p {
      line-height: 1.25; }

.info_right p {
  line-height: 1.25; }

.info_left {
  grid-column: 2/6; }
  .info_left h2 {
    grid-column: span 1; }
  .info_left .content {
    grid-column: span 3; }
  .info_left section {
    grid-template-columns: repeat(4, 1fr); }

.info_right {
  grid-column: 6/11; }
  .info_right h2 {
    grid-column: span 1; }
  .info_right .content {
    grid-column: span 4; }
  .info_right section {
    grid-template-columns: repeat(5, 1fr); }

@media (max-width: 768px) {
  body.case_studies footer {
    margin-top: 0; }
  #project_info {
    padding-top: 0;
    border-top: 0; }
  .info_section {
    display: block;
    padding: 0 var(--gutter); }
    .info_section section {
      display: block;
      padding-top: var(--gutter); }
  .info_left .content {
    margin-bottom: var(--gutter); }
  .info_right .content {
    margin-bottom: var(--gutter); } }