/* -- MIXINS -- */
/* --  RESET -- */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block; }

ol,
ul {
  list-style: none; }

blockquote,
q {
  quotes: none; }

blockquote:before,
blockquote:after {
  content: "";
  content: none; }

q:before,
q:after {
  content: "";
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

* {
  box-sizing: border-box; }

*:before,
*:after {
  box-sizing: border-box; }

.visually-hidden {
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap; }

/* -- GLOBAL -- */
:root {
  --trans: 0.5s ease opacity;
  --mainpad: 40px;
  --spacerSmall: 60px;
  --spacerMedium: 120px;
  --spacerLarge: 240px;
  --spaceXXL: 360px; }
  @media (max-width: 900px) {
    :root {
      --mainpad: 30px; } }
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 14px;
  font-family: "neue-haas-unica", sans-serif;
  line-height: 1.2; }

body {
  width: 100vw;
  overflow-x: hidden; }

.page-content {
  background-color: #fff; }

img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center; }

h2 {
  text-align: center;
  text-decoration: underline;
  text-transform: uppercase;
  margin-bottom: 50px; }

a,
a:visited {
  text-decoration: none;
  color: inherit;
  transition: opacity 0.5s; }
  a:hover,
  a:visited:hover {
    opacity: 0.5; }

a.button {
  border: 1px solid black;
  border-radius: 500px;
  padding: 0.5em 1em;
  display: block;
  width: fit-content;
  margin: 0 auto;
  cursor: pointer;
  background-color: transparent;
  transition: all 0.5s ease; }
  a.button:hover {
    background-color: black;
    color: #fff;
    opacity: 1; }

footer {
  position: relative;
  width: 100vw;
  padding: var(--mainpad); }
  footer p.copyright {
    line-height: 1;
    color: #000; }
    footer p.copyright span {
      overflow: hidden;
      display: inline-grid;
      transition: all 0.5s linear; }
      footer p.copyright span.collapse {
        max-width: 0; }
        footer p.copyright span.collapse span {
          width: max-content;
          margin-left: 1ch; }
    footer p.copyright:hover span.collapse {
      max-width: 17ch; }

/* -- PAGE -- */
section.landing {
  height: 100%;
  width: 100vw; }
  @media (max-width: 900px) {
    section.landing {
      position: relative;
      height: 100vh;
      z-index: 1; } }
  section.landing h1 {
    position: absolute;
    bottom: 0;
    padding: var(--mainpad);
    font-size: 14.5rem;
    line-height: 0.84;
    letter-spacing: -0.02em;
    padding-bottom: calc(var(--mainpad) + 0.2em);
    width: 10ch;
    transition: all 1s; }
    @media (min-width: 900px) and (max-width: 1400px) {
      section.landing h1 {
        font-size: 14.097vw; } }
    @media (max-width: 900px) {
      section.landing h1 {
        font-size: 14.097vw;
        padding-bottom: calc(2 * var(--mainpad)); } }
    @media (min-width: 1400px) {
      section.landing h1 {
        font-size: 15vw; } }
    @media (min-width: 1750px) {
      section.landing h1 {
        font-size: 18.75rem; } }
  section.landing div.introduction {
    width: 100vw;
    display: flex;
    justify-content: flex-end;
    padding-right: 200px;
    padding-left: var(--mainpad);
    margin-top: var(--spacerMedium);
    transition: all 1s; }
    @media (min-width: 900px) and (max-width: 1400px) {
      section.landing div.introduction {
        padding-right: 14.285714vw; } }
    @media (max-width: 900px) {
      section.landing div.introduction {
        margin-top: var(--mainpad);
        padding-right: var(--mainpad);
        justify-content: flex-start; } }
    @media (min-width: 1400px) {
      section.landing div.introduction {
        padding-right: 14.285714vw;
        margin-top: 8.5714290612vw; } }
    @media (min-width: 1750px) {
      section.landing div.introduction {
        padding-right: 250px;
        margin-top: 150px; } }
    section.landing div.introduction p {
      display: flex;
      flex-direction: column;
      width: 46ch; }
      section.landing div.introduction p span {
        margin-bottom: 1em; }

.gallery {
  background-color: #fff;
  z-index: 100;
  max-width: calc(100vh * 1.6);
  margin: 0 auto; }
  @media (max-width: 900px) {
    .gallery {
      margin-top: 0;
      z-index: 1; } }
.block {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: auto;
  grid-column-gap: var(--mainpad);
  padding: var(--mainpad); }
  .block:first-of-type {
    padding-top: 0; }
  @media (max-width: 900px) {
    .block .aspectHolder {
      grid-column: 1 / 13 !important; } }
  .block.fullwidth .aspectHolder {
    grid-column: 1/13;
    height: 0;
    position: relative;
    padding-bottom: 66.666666%; }
  .block.singleLandscape .aspectHolder {
    height: 0;
    position: relative;
    padding-bottom: 66.666666%; }
    .block.singleLandscape .aspectHolder[data-size="6col"] {
      grid-column-end: span 6; }
    .block.singleLandscape .aspectHolder[data-size="7col"] {
      grid-column-end: span 7; }
    .block.singleLandscape .aspectHolder[data-size="8col"] {
      grid-column-end: span 8; }
    .block.singleLandscape .aspectHolder[data-offset="one"] {
      grid-column-start: 2; }
    .block.singleLandscape .aspectHolder[data-offset="two"] {
      grid-column-start: 3; }
    .block.singleLandscape .aspectHolder[data-offset="three"] {
      grid-column-start: 4; }
    .block.singleLandscape .aspectHolder[data-offset="four"] {
      grid-column-start: 5; }
    .block.singleLandscape .aspectHolder[data-offset="five"] {
      grid-column-start: 6; }
    .block.singleLandscape .aspectHolder[data-offset="six"] {
      grid-column-start: 7; }
  .block.threePortrait .aspectHolder {
    height: 0;
    padding-bottom: 150%;
    position: relative;
    grid-column-end: span 4; }
    .block.threePortrait .aspectHolder.left {
      grid-column-start: 1; }
    .block.threePortrait .aspectHolder.mid {
      grid-column-start: 5; }
    .block.threePortrait .aspectHolder.right {
      grid-column-start: 9; }
  .block.singlePortrait .aspectHolder {
    height: 0;
    padding-bottom: 150%;
    position: relative; }
    .block.singlePortrait .aspectHolder[data-size="4col"] {
      grid-column-end: span 4; }
    .block.singlePortrait .aspectHolder[data-size="5col"] {
      grid-column-end: span 5; }
    .block.singlePortrait .aspectHolder[data-size="6col"] {
      grid-column-end: span 6; }
    .block.singlePortrait .aspectHolder[data-offset="one"] {
      grid-column-start: 2; }
    .block.singlePortrait .aspectHolder[data-offset="two"] {
      grid-column-start: 3; }
    .block.singlePortrait .aspectHolder[data-offset="three"] {
      grid-column-start: 4; }
    .block.singlePortrait .aspectHolder[data-offset="four"] {
      grid-column-start: 5; }
    .block.singlePortrait .aspectHolder[data-offset="five"] {
      grid-column-start: 6; }
    .block.singlePortrait .aspectHolder[data-offset="six"] {
      grid-column-start: 7; }
    .block.singlePortrait .aspectHolder[data-offset="seven"] {
      grid-column-start: 8; }
    .block.singlePortrait .aspectHolder[data-offset="eight"] {
      grid-column-start: 9; }
  .block.dualPortrait .aspectHolder {
    height: 0;
    padding-bottom: 150%;
    position: relative;
    grid-column-end: span 5; }
    .block.dualPortrait .aspectHolder[data-offset="one"] {
      grid-column-start: 2; }
    .block.dualPortrait .aspectHolder:nth-of-type(2) {
      grid-column-start: 7; }
      .block.dualPortrait .aspectHolder:nth-of-type(2)[data-offset="one"] {
        grid-column-start: 8; }
  .block.dualLandscape .aspectHolder {
    height: 0;
    position: relative;
    padding-bottom: 66.666666%;
    grid-column-end: span 6; }
    .block.dualLandscape .aspectHolder:nth-of-type(2) {
      grid-column-start: 7; }
  .block.landscapePortrait {
    align-items: center; }
    .block.landscapePortrait[data-side="true"] {
      /*- Portrait Left -*/ }
      .block.landscapePortrait[data-side="true"] .aspectHolder:first-of-type {
        height: 0;
        padding-bottom: 150%;
        position: relative;
        grid-column: 1/6; }
      .block.landscapePortrait[data-side="true"] .aspectHolder:nth-of-type(2) {
        height: 0;
        position: relative;
        padding-bottom: 66.666666%;
        grid-column: 7/13; }
    .block.landscapePortrait[data-side="false"] {
      /*- Portrait Right -*/ }
      .block.landscapePortrait[data-side="false"] .aspectHolder:first-of-type {
        height: 0;
        position: relative;
        padding-bottom: 66.666666%;
        grid-column: 1/7; }
      .block.landscapePortrait[data-side="false"] .aspectHolder:nth-of-type(2) {
        height: 0;
        padding-bottom: 150%;
        position: relative;
        grid-column: 8/13; }
  .block.biggieSmalls {
    align-items: center; }
    .block.biggieSmalls .aspectHolder {
      grid-row: 1/2;
      height: 0;
      padding-bottom: 150%;
      position: relative; }
    .block.biggieSmalls[data-side="true"] {
      /*- Small Left -*/ }
      .block.biggieSmalls[data-side="true"] .aspectHolder:first-of-type {
        grid-column-end: span 5;
        grid-column-start: 7; }
        .block.biggieSmalls[data-side="true"] .aspectHolder:first-of-type[data-offset="one"] {
          grid-column-start: 8; }
      .block.biggieSmalls[data-side="true"] .aspectHolder:nth-of-type(2) {
        grid-column-start: 1; }
        .block.biggieSmalls[data-side="true"] .aspectHolder:nth-of-type(2)[data-offset="one"] {
          grid-column-start: 2; }
        .block.biggieSmalls[data-side="true"] .aspectHolder:nth-of-type(2)[data-offset="two"] {
          grid-column-start: 3; }
        .block.biggieSmalls[data-side="true"] .aspectHolder:nth-of-type(2)[data-offset="three"] {
          grid-column-start: 4; }
        .block.biggieSmalls[data-side="true"] .aspectHolder:nth-of-type(2)[data-offset="four"] {
          grid-column-start: 5; }
        .block.biggieSmalls[data-side="true"] .aspectHolder:nth-of-type(2)[data-size="3col"] {
          grid-column-end: span 3; }
        .block.biggieSmalls[data-side="true"] .aspectHolder:nth-of-type(2)[data-size="4col"] {
          grid-column-end: span 4; }
        .block.biggieSmalls[data-side="true"] .aspectHolder:nth-of-type(2)[data-size="5col"] {
          grid-column-end: span 5; }
    .block.biggieSmalls[data-side="false"] {
      /*- Small Right -*/ }
      .block.biggieSmalls[data-side="false"] .aspectHolder:first-of-type {
        grid-column-end: span 5;
        grid-column-start: 1; }
        .block.biggieSmalls[data-side="false"] .aspectHolder:first-of-type[data-offset="one"] {
          grid-column-start: 2; }
      .block.biggieSmalls[data-side="false"] .aspectHolder:nth-of-type(2) {
        grid-column-start: 7; }
        .block.biggieSmalls[data-side="false"] .aspectHolder:nth-of-type(2)[data-offset="one"] {
          grid-column-start: 8; }
        .block.biggieSmalls[data-side="false"] .aspectHolder:nth-of-type(2)[data-offset="two"] {
          grid-column-start: 9; }
        .block.biggieSmalls[data-side="false"] .aspectHolder:nth-of-type(2)[data-offset="three"] {
          grid-column-start: 10; }
        .block.biggieSmalls[data-side="false"] .aspectHolder:nth-of-type(2)[data-offset="four"] {
          grid-column-start: 11; }
        .block.biggieSmalls[data-side="false"] .aspectHolder:nth-of-type(2)[data-size="3col"] {
          grid-column-end: span 3; }
        .block.biggieSmalls[data-side="false"] .aspectHolder:nth-of-type(2)[data-size="4col"] {
          grid-column-end: span 4; }
        .block.biggieSmalls[data-side="false"] .aspectHolder:nth-of-type(2)[data-size="5col"] {
          grid-column-end: span 5; }
  .block img {
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    object-position: center;
    height: 100%;
    width: 100%; }
  .block[data-pad="small"] {
    padding-bottom: var(--spacerSmall); }
  .block[data-pad="medium"] {
    padding-bottom: var(--spacerMedium); }
  .block[data-pad="large"] {
    padding-bottom: var(--spacerLarge); }
  .block[data-pad="xxl"] {
    padding-bottom: var(--spaceXXL); }
  @media (max-width: 900px) {
    .block {
      padding-top: 0;
      grid-row-gap: var(--mainpad); }
      .block[data-pad="small"], .block[data-pad="medium"], .block[data-pad="large"], .block[data-pad="xxl"] {
        padding-bottom: var(--mainpad); } }
