@charset "UTF-8";
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Reset */
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
html {
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}

*, *::before, *::after {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  box-sizing: inherit;
  margin: 0;
  padding: 0;
  user-select: none;
}

button, textarea, input, select, a {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  -webkit-tap-highlight-color: transparent;
}

i {
  font-style: unset;
}

b {
  font-weight: unset;
}

a {
  text-decoration: none;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Roots */
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
:root {
  --blu: 9.00px;
  --chroma: "Chroma", "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif;
  --black: hsl(0 0% 0%);
  --white: hsl(0 0% 100%);
  --gray: hsl(0 0% 70%);
  --line: 1px;
  --cs: 300px;
  --lhr: 0.9090909091;
  --c-lh: calc(var(--blu) * 8);
  --c-fs: calc(var(--c-lh) * var(--lhr));
  --c-fw: 300;
  --p-lh: calc(var(--blu) * 2);
  --p-fs: calc(var(--p-lh) * var(--lhr));
  --p-fw: 400;
  --n-lh: calc(var(--blu) * 1.2727272728);
  --n-fs: calc(var(--n-lh) * var(--lhr));
  --n-fw: 500;
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Global */
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
body {
  background: var(--white);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: none !important;
}

.seoMessage {
  position: fixed;
  opacity: 0;
  width: 0;
  height: 0;
  top: -9999px;
  left: -9999px;
  overflow: hidden;
}

.btn {
  color: var(--white) !important;
}
.btn:hover {
  color: var(--white) !important;
}

.dropShadow {
  --horizontal-offset: 0;
  --vertical-offset: 0;
  --blur-radius: calc(var(--blu) * 1);
  --shadowColor: rgba(0, 0, 0, 0.1);
  text-shadow: var(--horizontal-offset) var(--vertical-offset) var(--blur-radius) var(--shadowColor);
}

#shadowContainer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  pointer-events: none;
  user-select: none;
  transition-property: opacity;
  transition-duration: 1s;
  transition-timing-function: ease-in-out;
}

.aboutOpen #shadowContainer,
.infoOpen #shadowContainer {
  opacity: 0.1;
}

.tagIdem {
  white-space: nowrap;
}

*, *::before, *::after {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-drag: none;
}

.aboutButtons::before,
.infoButtons > div::before,
#aboutContainer .item > p::before,
.infoText::before {
  top: calc(0px - var(--blu) * 1.5);
  left: calc(0px - var(--blu) * 1.5);
  width: calc(100% + var(--blu) * 3);
  height: calc(100% + var(--blu) * 3);
}

#aboutContainer .item,
#aboutContainer .item > p {
  position: relative;
}

/* Cursor */
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
#cursorContainer {
  position: fixed;
  z-index: 1000;
  transform: translate(-50%, -50%);
  user-select: none;
  pointer-events: none;
  display: none;
}
#cursorContainer * {
  color: var(--white);
}
#cursorContainer .arrow {
  transition: transform 0.2s ease-in-out;
}
#cursorContainer .default,
#cursorContainer .close {
  display: none;
}
#cursorContainer .p {
  font-size: var(--c-fs);
  line-height: var(--c-lh);
  font-weight: var(--c-fw);
  color: var(--white);
  font-style: normal;
}

body:hover #cursorContainer {
  display: unset;
}
body.cursorRight #cursorContainer .arrow {
  transform: rotate(90deg);
}
body.cursorLeft #cursorContainer .arrow {
  transform: rotate(-90deg);
}
body.buttonHover #cursorContainer .arrow,
body.buttonHover #cursorContainer .close {
  display: none !important;
}
body.buttonHover #cursorContainer .default {
  display: unset;
}
body.aboutOpen #cursorContainer .arrow, body.infoOpen #cursorContainer .arrow {
  display: none;
}
body.aboutOpen #cursorContainer .close, body.infoOpen #cursorContainer .close {
  display: unset;
}

.touchevents #cursorContainer {
  display: none !important;
}

/* Header */
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
#titleContainer {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 900;
  padding: calc(var(--blu) * 1.5);
}

#contactContainer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 900;
  padding: calc(var(--blu) * 1.5);
  text-align: right;
  display: none;
}

#counterContainer {
  position: fixed;
  bottom: 50%;
  right: 50%;
  transform: translate(50%, 50%);
  z-index: 900;
  padding: calc(var(--blu) * 1.5);
  text-align: right;
}

/* Gallery */
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
#galleryContainer {
  user-select: none;
}
#galleryContainer .projectContainer .imagesContainer .item {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: var(--gray);
}
#galleryContainer .projectContainer .imagesContainer .item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#galleryContainer .projectContainer:not(.active, .next, .prev) {
  display: none;
}
#galleryContainer .projectContainer.next, #galleryContainer .projectContainer.prev {
  opacity: 0;
  user-select: none;
  pointer-events: none;
}
#galleryContainer .projectContainer.next .item:not(.active), #galleryContainer .projectContainer.prev .item:not(.active) {
  display: none;
}
#galleryContainer .projectContainer.active .item:not(.active) {
  opacity: 0;
}
#galleryContainer .projectContainer .plan {
  background: var(--gray);
}
#galleryContainer .projectContainer .plan img {
  mix-blend-mode: multiply;
}
#galleryContainer .projectContainer .image .zoomContainer {
  display: none;
}
#galleryContainer .infoButtons .open,
#galleryContainer .infoButtons .close {
  position: fixed;
  bottom: 0;
  right: 0;
  margin: calc(var(--blu) * 1.5);
  z-index: 900;
  color: var(--white);
}
#galleryContainer .infoButtons .open span,
#galleryContainer .infoButtons .close span {
  display: none;
}
#galleryContainer .infoButtons .close {
  display: none;
  right: 50%;
  transform: translateX(50%);
}
#galleryContainer .infoContainer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 800;
  text-align: center;
  display: none;
}
#galleryContainer .infoContainer .infoText {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#galleryContainer .infoContainer .infoText a {
  display: inline;
}
#galleryContainer .infoContainer .infoText * {
  width: calc(100vw - var(--blu) * 3);
  max-width: calc(var(--blu) * 80);
}
#galleryContainer .infoContainer * {
  color: var(--white);
}

body.infoOpen #titleContainer,
body.infoOpen #contactContainer,
body.infoOpen #counterContainer,
body.infoOpen #aboutContainer {
  display: none;
}
body.infoOpen #galleryContainer .infoButtons .open {
  display: none;
}
body.infoOpen #galleryContainer .infoButtons .close {
  display: unset;
}
body.infoOpen #galleryContainer .infoContainer {
  display: unset;
}

/* Collection */
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
#collectionContainer {
  position: fixed;
  top: 50%;
  left: 50%;
  width: var(--cs);
  height: calc(var(--cs) * 1.333);
  transform: translate(-50%, -50%);
  pointer-events: none;
  visibility: hidden;
  z-index: 900;
}
#collectionContainer .item:not(.active) {
  display: none;
}
#collectionContainer .item img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.collection #collectionContainer {
  visibility: visible;
}
body.collection .btn {
  pointer-events: none;
}

/* About */
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
#aboutContainer {
  position: relative;
  z-index: 100;
}
#aboutContainer .aboutButtons {
  position: fixed;
  bottom: 0;
  left: 0;
  margin: calc(var(--blu) * 1.5);
}
#aboutContainer .aboutButtons * {
  color: var(--white);
}
#aboutContainer .aboutText {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  text-align: center;
  overflow: scroll;
  display: none;
}
#aboutContainer .aboutText .cart.sectionTitle {
  height: calc(100vh - var(--p-lh) * 6);
}
#aboutContainer .aboutText .cart.sectionTitle h2 {
  position: sticky;
  top: 0;
  padding-top: calc(50vh - var(--p-lh) * 0.5);
}
#aboutContainer .aboutText .cart.sectionContent .item {
  padding-top: calc(var(--p-lh));
  padding-left: calc(var(--blu) * 1.5);
  padding-right: calc(var(--blu) * 1.5);
}
#aboutContainer .aboutText .cart.sectionContent .item.cap {
  display: flex;
  justify-content: center;
}
#aboutContainer .aboutText .cart.sectionContent .item.cap p {
  max-width: calc(var(--blu) * 80);
}
#aboutContainer .aboutText .cart.sectionContent .item.spacer {
  display: block;
  height: calc(var(--p-lh) * 5);
}
#aboutContainer .aboutText .cart.sectionContent .btn {
  padding-top: var(--p-lh);
}
#aboutContainer .aboutText .cart.footer {
  padding-bottom: calc(var(--blu) * 1.5);
}
#aboutContainer .aboutText .cart.footer h1 {
  margin-top: calc(var(--p-lh));
}
#aboutContainer .aboutText .cart .item {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#aboutContainer .aboutText .cart .item p {
  width: fit-content;
  padding-top: 0 !important;
}

body.aboutOpen #titleContainer,
body.aboutOpen #contactContainer,
body.aboutOpen #counterContainer,
body.aboutOpen .aboutButtons {
  display: none;
}
body.aboutOpen #galleryContainer .infoButtons {
  display: none;
}
body.aboutOpen #aboutContainer .aboutText {
  display: unset;
}

/* Loader */
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
#loaderContainer {
  position: fixed;
  top: 0;
  left: 0;
  background: var(--gray);
  width: 100%;
  height: 100%;
  z-index: 1100;
  color: var(--white);
}
#loaderContainer .loader {
  display: inline-block;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: rotation 2s linear infinite;
}
#loaderContainer .loader::before {
  content: "SRL";
  display: block;
  font-size: var(--p-fs);
}
#loaderContainer .loading {
  cursor: default;
  background: var(--grey);
}
#loaderContainer .loading .loader {
  display: inline-block;
}
@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Typo */
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Chroma Std */
@font-face {
  font-family: "Chroma";
  src: url("fonts/Chroma-ST-Light.woff2") format("woff2"), url("fonts/Chroma-ST-Light.woff") format("woff");
  font-style: normal;
  font-weight: 300;
}
@font-face {
  font-family: "Chroma";
  src: url("fonts/Chroma-ST-Regular.woff2") format("woff2"), url("fonts/Chroma-ST-Regular.woff") format("woff");
  font-style: normal;
  font-weight: 400;
}
*, *::before, *::after {
  font-family: var(--chroma);
  font-style: normal;
  font-weight: var(--p-fw);
}

h1, h2, h3, h4, h5, h6, p, a,
.h1, .h2, .h3, .h4, .h5, .h6, .p, .a {
  font-family: var(--chroma);
  font-size: var(--p-fs);
  line-height: var(--p-lh);
  font-weight: var(--p-fw);
  color: var(--white);
  font-style: normal;
}
h1.margin, h2.margin, h3.margin, h4.margin, h5.margin, h6.margin, p.margin, a.margin,
.h1.margin, .h2.margin, .h3.margin, .h4.margin, .h5.margin, .h6.margin, .p.margin, .a.margin {
  margin-bottom: var(--p-lh);
}
h1.n, h2.n, h3.n, h4.n, h5.n, h6.n, p.n, a.n,
.h1.n, .h2.n, .h3.n, .h4.n, .h5.n, .h6.n, .p.n, .a.n {
  font-size: var(--n-fs);
  line-height: var(--n-lh);
  font-weight: var(--n-fw);
}

.footer h1 {
  font-size: var(--n-fs);
  line-height: var(--n-lh);
  font-weight: var(--n-fw);
}

.margin h1, .margin h2, .margin h3, .margin h4, .margin h5, .margin h6, .margin p,
.margin .h1, .margin .h2, .margin .h3, .margin .h4, .margin .h5, .margin .h6, .margin .p {
  margin-bottom: var(--p-lh);
}

a, .a {
  cursor: none;
  --color: var(--white);
  color: var(--color);
}
a:link, a:visited, a:active, a:hover, .a:link, .a:visited, .a:active, .a:hover {
  color: inherit;
  display: inline-block;
  position: relative;
  cursor: none;
}
a:not(.inner)::after, .a:not(.inner)::after {
  content: "";
  display: block;
  position: absolute;
  bottom: calc(0px - var(--blu) * 0.15);
  left: 0;
  width: 100%;
  height: var(--line);
  background: var(--color);
}
a:not(.inner):hover::after, .a:not(.inner):hover::after {
  display: none;
}
a:not(.inner).hidden::after, .a:not(.inner).hidden::after {
  display: none;
}
a:not(.inner).hidden:hover::after, .a:not(.inner).hidden:hover::after {
  display: unset;
}
a.inner > span, .a.inner > span {
  position: relative;
}
a.inner > span::after, .a.inner > span::after {
  content: "";
  display: block;
  position: absolute;
  bottom: calc(0px - var(--blu) * 0.15);
  left: 0;
  width: 100%;
  height: var(--line);
  background: var(--color);
}
a.inner > span:hover::after, .a.inner > span:hover::after {
  display: none;
}
a.inner:hover ::after, .a.inner:hover ::after {
  display: none;
}
a.inner.hidden ::after, .a.inner.hidden ::after {
  display: none;
}
a.inner.hidden:hover ::after, .a.inner.hidden:hover ::after {
  display: unset;
}

.typo {
  padding: var(--blu);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: var(--gray);
}
.typo p {
  max-width: calc(var(--blu) * 100);
}

@media all and (max-width: 35em) {
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  /* 01 / Mobile */
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  :root {
    --media: _00_Mobile;
  }
}
@media all and (min-width: 35em) {
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  /* 02 / Tablet */
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  :root {
    --media: _02_Tablet;
    --blu: 10.03px;
    --p-fw: 300;
    --n-fw: 400;
  }
}
@media all and (min-width: 55em) {
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  /* 03 / Tablet-Laptop */
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  :root {
    --media: _03_Tablet_Laptop;
    --blu: 11.07px;
  }
  .mobileOnly {
    display: none;
  }
  /* Header */
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  #contactContainer {
    display: unset;
  }
  #counterContainer {
    position: fixed;
    transform: translate(0, 0);
    bottom: 0;
    right: 0;
  }
  /* Gallery */
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  #galleryContainer .projectContainer .imagesContainer .item[width="1"] img {
    width: 50%;
  }
  #galleryContainer .projectContainer .image .zoomContainer {
    display: unset;
    width: 50%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    overflow: hidden;
  }
  #galleryContainer .projectContainer .image .zoomContainer img {
    --zoom: 200%;
    width: var(--zoom) !important;
    height: var(--zoom) !important;
    transform: translate(50%, 50%);
    position: absolute;
  }
  #galleryContainer .infoButtons .open,
  #galleryContainer .infoButtons .close {
    bottom: 0;
    right: 50%;
    transform: translateX(calc(50% + var(--blu) * 1.5));
  }
  #galleryContainer .infoButtons .open span,
  #galleryContainer .infoButtons .close span {
    display: unset;
  }
  /* Collection */
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  #collectionContainer {
    width: 30.9023485785vw;
    height: 41.1928306551vw;
  }
}
@media all and (min-width: 75em) {
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  /* 04 / Laptop */
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  :root {
    --media: _04_Laptop;
    --blu: 12.1px;
  }
}
@media all and (min-width: 120em) {
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  /* 05 / Desktop */
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  :root {
    --media: _05_Desktop;
    --blu: 13.13px;
  }
}
@supports (-webkit-hyphens: none) {
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
  /* 00 / Safari Only */
  /* –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
}

/*# sourceMappingURL=main-compiled.css.map */