@font-face {
    font-family: NeueHaasGrotesk;
    src: url("../fonts/NeueHaasGrotesk/Neue\ Haas\ Grot\ Disp-65\ Medium.otf") format("opentype");
}
@font-face {
    font-family: NeueHaasGroteskRoman;
    src: url("../fonts/NeueHaasGrotesk/Neue\ Haas\ Grot\ Disp-55\ Roman.otf") format("opentype");
}

/* @font-face {
    font-family: NeueHaasGrotesk;
    font-weight: bold;
    src: url("path/GraublauWebBold.otf") format("opentype");
} */

@font-face {
    font-family: Beni;
    src: url("../fonts/Beni/Beni-Bold.otf") format("opentype");
}

text {
  font-family: Beni !important;
}

* {
  margin: 0;
  border: 0;
  padding: 0;
}
body:not(.is-touch) * {
  cursor: none !important;
}


:root {
    --black: #0D0D0D;
    --dark-gray: #1A1A1A;
    --black-border: #313131;
    --black-words: #262626;
    --white: #EBEBEB;
    --primary: #C4F815;
    --red: #F83015;

    --animation-ease: cubic-bezier(0.73, 0.05, 0.43, 1.02);
}

*::selection {
    background: var(--white);
    color: var(--black);
}

body {
    overflow: hidden;
    color: var(--white);
    background-color: var(--black);
    font-family: NeueHaasGroteskRoman;
}
/* body.loaded {
    background-color: var(--white);
} */
@media screen and (max-width: 768px) {
    body {
        overflow: hidden auto;
    }
}

.global {
    width: 100vw;
    min-height: 100vh;
    background-color: var(--black);
}

.header {
    width: 100vw;
    padding: 0 43px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 10;
    position: fixed;
    top: 0;
    transform: translateY(-100%);
    height: 100px;
    pointer-events: none;
    transition: transform .8s var(--animation-ease), opacity .8s var(--animation-ease) !important;
}

.header, .header * {
  user-select: none;
}

.header.header-loaded {
  transform: translateY(-0%);
}
.header * {
  pointer-events: auto;
}
.header__logo {
    cursor: pointer;
    opacity: 1;
    transition: opacity .7s ease;
}

.header__links {
    display: flex;
    gap: 32px;
    transform: translateY(0px);
    transition: transform .7s var(--animation-ease);
    font-family: NeueHaasGrotesk;
}

.header_link {
    cursor: pointer;
    color: var(--white);
    text-decoration: none;
    position: relative;
    background-image: linear-gradient(
    to left,
    var(--white),
    var(--white) 50%,
    var(--primary) 50%
    );
    background-size: 200% 100%;
    background-position: -100%;
    display: inline-block;
    position: relative;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    transform: translateY(0px);
    transition: background-position 0.3s ease-in-out,;
}


.header_link svg {
  position: absolute;
  top: 50%;
  left: 0rem;
  transform: translateY(-50%);
  stroke-dasharray: 400;
  stroke-dashoffset: 1200;
  transition: stroke-dasharray .4s var(--ease-svg);
}
.header_link.link-info svg {
  left: -1rem;
}

.header_link:hover svg {
  stroke-dasharray: 480;
}
.header_link.link-info:hover svg {
  stroke-dasharray: 470;
}

.global.open-projects-modal .header__links, .global.open-info-modal .header__links {
  transform: translateY(-80px);
}
.global.open-projects-modal .header__logo, .global.open-info-modal .header__logo {
  opacity: .3;
  pointer-events: none;
}

.link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--black-words);
    text-decoration: none;
    position: relative;
}


:root {
  --menu-clickable-height: 70px;
  --menu-height: 80vh;
  --menu-arrow-width: 60px;

  --section-offset-2: -42px;
  --section-offset-3: 130px;
  --section-offset-4: 50px;
  --section-offset-5: -42px;
}


.menu {
  position: fixed;
  /* bottom: 0; */
  left: 0;
  width: 100vw;
  background-color: var(--black);
  height: var(--menu-clickable-height);
  transition: height .8s var(--animation-ease);
}

.menu__clickable {
  position: relative;
  padding: 0 43px;
  height: var(--menu-clickable-height);
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid var(--black-border);
}

.menu__item {
  font-size: 14px;
  text-transform: uppercase;
  color: inherit;
  text-decoration: none;
}

.menu__cross {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: none;
}

.menu__cross > svg {
  height: 29px;
  width: 29px;
  cursor: pointer;
  pointer-events: auto;
  transition: transform .8s var(--animation-ease);
}

.menu__tag {
  font-size: 20px;
  text-transform: uppercase;
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translate(-50%, 150vh);
  transition: transform .8s var(--animation-ease);
}

.header, .content {
  transition: opacity .8s var(--animation-ease);
}

.content {
  background-color: var(--black);
}

.menu__border-bottom {
  width: 100%;
  height: 1px;
  background-color: var(--black-border);
  transition: transform .8s var(--animation-ease), opacity .8s var(--animation-ease);
  transform: translateY(20vh);
  opacity: 0;
}

.menu__sections {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  height: calc(var(--menu-height) - 150px);
}

.menu__section {
  display: flex;
  align-items: center;
  gap: 14px;
  cursor: pointer;
  transition: transform .8s var(--animation-ease);
}

.menu__section:nth-of-type(1) {
  transform: translate(calc(var(--menu-arrow-width) * -1), 100%)
}
.menu__section:nth-of-type(2) {
  transform: translate(calc(var(--menu-arrow-width) * -1 + var(--section-offset-2)), 200%)
}
.menu__section:nth-of-type(3) {
  transform: translate(calc(var(--menu-arrow-width) * -1 + var(--section-offset-3)), 300%)
}
.menu__section:nth-of-type(4) {
  transform: translate(calc(var(--menu-arrow-width) * -1 + var(--section-offset-4)), 400%)
}
.menu__section:nth-of-type(5) {
  transform: translate(calc(var(--menu-arrow-width) * -1 + var(--section-offset-5)), 500%)
}


.menu__section > img, .menu__section > span {
  transition: transform .34s ease, opacity .34s ease;
}
.menu__section > img {
  opacity: 0;
  transform: translateX(-50px);
  width: var(--menu-arrow-width);
}
.menu__section > span {
  font-family: NeueHaasGrotesk;
  font-size: 20px;
  transform: translateX(0px);
}
.menu__section > h2 {
  font-family: Beni;
  font-size: 166px;
  line-height: 107px;
  transition: color .13s ease;
}


.menu__section:hover > img {
  transform: translateX(20px);
  opacity: 1;
}
.menu__section:hover > span {
  transform: translateX(50px);
  opacity: 0;
}
.menu__section:hover > h2 {
  color: var(--primary);
}




.global.open-menu .header,
.global.open-menu .content,
.global.open-projects-modal .header,
.global.open-projects-modal .content {
  opacity: .95;
}

.global.open-menu .menu {
  height: var(--menu-height);
}

.global.open-menu .menu__cross > svg {
  transform: rotate(-45deg);
}

.global.open-menu .menu__section {
  transform: translate(calc(var(--menu-arrow-width) * -1 + 10px), 0px)
}

.global.open-menu .menu__border-bottom {
  transform: translateY(0);
  opacity: 1;
}

.global.open-menu .menu__section:nth-of-type(2) {
  transform: translate(calc(var(--menu-arrow-width) * -1 + var(--section-offset-2)), 0px)
}
.global.open-menu .menu__section:nth-of-type(3) {
  transform: translate(calc(var(--menu-arrow-width) * -1 + var(--section-offset-3)), 0px)
}
.global.open-menu .menu__section:nth-of-type(4) {
  transform: translate(calc(var(--menu-arrow-width) * -1 + var(--section-offset-4)), 0px)
}
.global.open-menu .menu__section:nth-of-type(5) {
  transform: translate(calc(var(--menu-arrow-width) * -1 + var(--section-offset-5)), 0px)
}

.global.open-menu .menu__tag {
  transform: translate(-50%, 0);
}


@media screen and (max-width: 1440px), screen and (max-height: 900px) {
  :root {
    --menu-height: 100vh;
  }
}





.home, .projects {
  width: 100vw;
  height: 90vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.projects {
  transform: translateY(-17%);
  height: 100vh;
}

body.projects-view .projects {
  transform: translateY(0%);
}

.grid {
  position: relative;
  z-index: 3;
  min-width: 100vw;
  max-width: 100vw;
  width: 100vw;
  display: flex;
  flex-direction: column;
  justify-content: center;
}



.grid * {
  user-select: none;
}


h1, .h1 {
  display: inline-block;
  margin-top: 0px;
  margin-bottom: 0px;
  font-family: Beni, sans-serif;
  font-size: 16rem;
  line-height: .8em;
  font-weight: 400;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--secondary-bg);
}

.h1.--aut {
  font-size: 5.313rem;
}

.reveal-title {
  visibility: hidden;
  height: 1.1em;
}
.authentication .reveal-title {
  height: 1.1em;
}
.authentication .reveal-title .split-parent {
  padding-top: .1em;
}
body.init-load .reveal-title {
  visibility: inherit;
}

.text {
  font-size: 14px;
  line-height: 1.43em;
  color: var(--text-color);
  position: absolute;
  left: 0.938rem;
  top: 1.25rem;
  text-wrap: balance;
  max-width: 280px;
}

.number {
  color: var(--accent);
  position: absolute;
  left: -1.875rem;
  top: 1.313rem;
  font-family: NeueHaasGroteskRoman;
  pointer-events: none;
}

/* NEW STYLES */

.row {
  display: flex;
  gap: 0 4.375rem;
  justify-content: center;
  width: 100vw;
  padding: 0 150px;
  flex-wrap: wrap;
}
.row.r1 {
  /* margin-left: 15.938rem; */
}
.row.r2 {
  /* margin-left: 33.313rem; */
}
.row.r3 {
  /* margin-left: 4.438rem; */
}

.project_title {
  font-size: 12.25rem;
  overflow: hidden;
  margin-bottom: -1rem;
  transition: color .1s ease;
}

.project-link.mobile-centered .project_title {
  color: var(--white) !important;
}

.home__cnt {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.home__inner {
  width: 63rem;
  height: 40.5rem;
  position: relative;
}
.authentication .home__inner {
  height: 12.5rem;
  width: 19rem;
}

.name, .surname, .designer, .graphic, .home__text-1, .home__text-2, .home__year, .home__buttons, .home__arrow, .home__smile, .aut_1, .aut_2 {
  position: absolute;
}
.aut_2 {
  color: var(--white) !important;
}
.name, .surname, .designer, .graphic {
  line-height: 1em;
}

.project-link .project_title {
  transition: color .4s ease;
}

.project-link .number {
  transition: transform .5s ease, opacity .3s ease;
}


.project-link .text {
  transition: transform .4s ease, opacity .2s ease;
  pointer-events: none;
}


.project-link .text {
  text-transform: uppercase;
  font-family: NeueHaasGroteskRoman;
}

.project_arrow {
  width: 2.25rem;
  height: 2.25rem;
  position: absolute;
  left: -2.875rem;
  top: 1.313rem;
  transform: translateY(30px);
  opacity: 0;
  transition: transform .45s ease, opacity .3s ease;
  pointer-events: none;
}


.home__text-1 {
  top: 3rem;
  left: 0;
}
.home__text-2 {
  top: 27rem;
  left: 41.4rem;
}

.home__year {
  top: 12.6rem;
  left: 41.4rem;
  color: var(--accent);
}

.designer, .graphic {
  color: var(--secondary-bg)
}
.name {
  top: 6.5rem;
  left: 1rem;
  color: var(--white);
}
.surname {
  top: 1.05rem;
  left: 18.3rem;
  z-index: 1;
  color: var(--white);
}
.designer {
  top: 12rem;
  left: 18.3rem;
}
.graphic {
  top: 23rem;
  left: 9.4rem;
}

.aut_1 {
  top: 1.05rem;
  left: 0;
  color: var(--secondary-bg)
}
.aut_2 {
  top: 5rem;
  left: 0;
}

.home__buttons {
  display: flex;
  gap: 8px;
  bottom: 0;
  left: 7.4rem;
}

.home__arrow {
  top: 27rem;
  left: 37.5rem;
  z-index: 2;
  width: 25rem;
}

body:not(.touch-device) .project-link:hover .project_title,
body.touch-device .project-link.project-clicked .project_title {
  color: var(--white);
}
body:not(.touch-device) .project-link:hover .number,
body.touch-device .project-link.project-clicked .number {
  transform: translateY(-2.5rem);
  opacity: 0;
}
body:not(.touch-device) .project-link:hover .text,
body.touch-device .project-link.project-clicked .text {
  transform: translateY(-1.25rem);
  opacity: 0;
}
body:not(.touch-device) .project-link:hover .project_arrow,
body.touch-device .project-link.project-clicked .project_arrow {
  transform: translateY(0rem);
  opacity: 1;
}  



:root {
  --ease-svg: cubic-bezier( 0.59, 0.1, 0.58, 0.97 );
  --time-svg: .7s;
}

.home__arrow .arrow_tail {
  stroke-dasharray: 400;
  stroke-dashoffset: 1200;
  transition: stroke-dasharray var(--time-svg) var(--ease-svg) var(--time-svg);
}
body.loaded .home__arrow .arrow_tail {
  stroke-dasharray: 530;
}

.home__arrow .arrow_head {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  transition: stroke-dasharray var(--time-svg) var(--ease-svg) calc(var(--time-svg) * 2);
}
body.loaded .home__arrow .arrow_head {
  stroke-dasharray: 1420;
}

.home__smile {
  top: 20rem;
  left: 7.3rem;
  z-index: 2;
  width: 10.375rem;
  stroke-dasharray: 400;
  stroke-dashoffset: 1200;
  transition: stroke-dasharray var(--time-svg) var(--ease-svg) 0s;
}
body.loaded .home__smile {
  stroke-dasharray: 500;
}

.aut__svg {
  position: absolute;
  pointer-events: none;
  top: 13.5rem;
  left: -1.7rem;
  z-index: 2;
  width: 12.875rem;
  stroke-dasharray: 570;
  stroke-dashoffset: 1710;
  transition: stroke-dasharray .9s var(--ease-svg) 0s;
}
body.loaded .aut__svg {
  stroke-dasharray: 730;
}

@media (max-width: 1440px) {
  html {
    font-size: 1.111vw;
  }
}


.aut__form {
  display: flex;
  gap: 8px;
  z-index: 2;
  position: absolute;
  top: 10.5rem;
  opacity: 0;
}

.aut__form.failed input {
  outline: 2px solid var(--red) !important;
}

.aut__failed-phrase {
  position: absolute;
  top: calc(100% + 12px);
  left: 12px;
  color: var(--white);
  font-size: 14px;
}

.home__tags {
  position: absolute;
  top: 37.3rem;
  width: 30.9rem;
  left: 9.6rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  font-family: NeueHaasGroteskRoman;
  opacity: 0;
}

.home__img1 {
  position: absolute;
  z-index: 1;
  top: 0rem;
  left: 41rem;
  opacity: 0;
}
.home__img2 {
  position: absolute;
  z-index: 1;
  top: 23rem;
  left: -5rem;
  opacity: 0;
}

.floating1, .floating2 {
  width: 20.313rem;
}


.floating1 { 
    animation-name: floating1;
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
.floating2 { 
    animation-name: floating2;
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
 
@keyframes floating1 {
    0% { transform: translate(0,  0px) rotate(0deg); }
    50%  { transform: translate(0, 25px) rotate(-2deg); }
    100%   { transform: translate(0, -0px) rotate(0deg); }   
}
@keyframes floating2 {
    0% { transform: translate(0,  0px) rotate(0deg); }
    50%  { transform: translate(0, 25px) rotate(3deg); }
    100%   { transform: translate(0, -0px) rotate(0deg); }   
}




.projects {
    transition: transform .5s ease, opacity .4s ease;
}
.global.open-projects-modal .projects {
    transform: translateY(-120px);
    transition: transform .7s var(--animation-ease);
}

body:not(.loaded) .projects {
  opacity: 0 !important;
}

.projects__gradient {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100vw;
  height: 164px;
  z-index: 1;
  background: rgb(13,13,13);
  background: -moz-linear-gradient(0deg, rgba(13,13,13,1) 0%, rgba(13,13,13,0) 100%);
  background: -webkit-linear-gradient(0deg, rgba(13,13,13,1) 0%, rgba(13,13,13,0) 100%);
  background: linear-gradient(0deg, rgba(13,13,13,1) 0%, rgba(13,13,13,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0d0d0d",endColorstr="#0d0d0d",GradientType=1);
  transition: opacity .5s ease;
  
}
body.projects-view .projects__gradient {
  opacity: 0;
  pointer-events: none;
}

.projects__draw-top-left {
    position: absolute;
    top: 4rem;
    left: 10rem;
    height: 9.375rem;
    stroke-dasharray: 400;
    stroke-dashoffset: 1200;
    transition: stroke-dasharray var(--time-svg) var(--ease-svg) 1.4s;
}
body.init-load-projects .projects__draw-top-left {
    stroke-dasharray: 500;
}

.projects__draw-bottom-left {
    position: absolute;
    top: 34rem;
    left: 16rem;
    height: 6.688rem;
    stroke-dasharray: 400;
    stroke-dashoffset: 1200;
    transition: stroke-dasharray var(--time-svg) var(--ease-svg) 2s;
}
body.init-load-projects .projects__draw-bottom-left {
    stroke-dasharray: 500;
}

.projects__draw-top-right {
    position: absolute;
    top: 6rem;
    left: 101rem;
    height: 4.813rem;
    stroke-dasharray: 370;
    stroke-dashoffset: 1360;
    transition: stroke-dasharray var(--time-svg) var(--ease-svg) 3.2s;
}
body.init-load-projects .projects__draw-top-right {
    stroke-dasharray: 340;
}

.projects__draw-bottom-right {
    position: absolute;
    top: 28rem;
    left: 101rem;
    height: 13.625rem;
    stroke-dasharray: 430;
    stroke-dashoffset: 1360;
    transition: stroke-dasharray var(--time-svg) var(--ease-svg) 2.6s;
}
body.init-load-projects .projects__draw-bottom-right {
    stroke-dasharray: 340;
}



.projects__modal, .projects__modal-out {
  display: flex;
  position: fixed;
  bottom: -100%;
  left: 0;
  width: 100vw;
  background-color: var(--black);
  padding: 5.125rem 0px 5.125rem 2.75rem;
  height: calc(100vh - 100px);
  transition: bottom .8s var(--animation-ease);
  border-top-left-radius: 3.75rem;
  z-index: 10;
}

.projects__modal::-webkit-scrollbar, .projects__modal-out::-webkit-scrollbar {
  display: none !important;
}

.global.open-projects-modal .projects__modal,
.global.open-projects-modal .projects__modal-out {
    bottom: 0;
}

.projects__modal.in-animation {
  transform: translateY(120%);
}

.global.switch-projects-modal .projects__modal-out {
  transition: bottom .8s var(--animation-ease) .2s, left .8s var(--animation-ease) .2s, transform .8s var(--animation-ease) .2s;
  bottom: -150% !important;
  left: 30%;
  transform: rotate(15deg);
}

.global.switch-projects-modal .projects__modal.in-animation {
  transition: transform .8s var(--animation-ease);
  transform: translateY(0);
}

.projects__credits {
  position: absolute;
  bottom: 38px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 12px;
  line-height: 18px;
  text-transform: uppercase;
  color: var(--text-color);
}
.projects__credits a {
  color: var(--text-color);
}


.pm__info {
    width: 37.5rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.pm__info-top {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pm__tags {
    display: flex;
    flex-direction: column;
    gap: 0 10px;
    width: max-content;
    color: var(--white);
    font-size: 14px;
    opacity: .5;
    text-transform: uppercase;
}

.pm__tags-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    margin-bottom: 4px;
}

.pm__title {
    font-family: Beni;
    font-size: 9.375rem;
    line-height: .73;
    width: 90%;
}
.pm__description {
    font-size: 20px;
    line-height: 24px;
    max-width: 25rem;
    width: 100%;
}

.pm__close-btn__wrapper, .im__close-btn__wrapper {
  position: fixed;
  top: 1.5rem;
  right: 2.75rem;
  transform: translateY(-100px);
  transition: transform .7s ease;
  z-index: 3;
}

.pm__close-btn, .im__close-btn {
    --size: 3.25rem;
    width: var(--size);
    height: var(--size);
    cursor: pointer;
    transform: scale(1) rotate(90deg); 
    transition: transform .7s ease;
}
.global.open-projects-modal .pm__close-btn,
.global.open-info-modal .im__close-btn {
    transform: scale(1) rotate(0deg);
}
.global.open-projects-modal .pm__close-btn__wrapper,
.global.open-info-modal .im__close-btn__wrapper {
    transform: translateY(0);
}
.global.open-projects-modal .pm__close-btn__wrapper:hover .pm__close-btn,
.global.open-info-modal .im__close-btn__wrapper:hover .im__close-btn {
    transform: scale(.8) rotate(0deg) translateY(0);
}

.pm__close-btn path, .im__close-btn path {
    transition: fill .4s ease;
}
.pm__close-btn__wrapper:hover .pm__close-btn,
.im__close-btn__wrapper:hover .im__close-btn {
    transform: scale(.8);
}
.pm__close-btn__wrapper:hover .pm__close-btn path,
.im__close-btn__wrapper:hover .im__close-btn path {
    fill: var(--primary);
}

.pm__veil {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: white;
  opacity: 0;
  pointer-events: none;
  transition: opacity .8s var(--animation-ease);
}

.global.open-projects-modal .pm__veil {
  opacity: .1;
  pointer-events: all;
}


.split-parent {
  overflow: hidden;
}
.split-child {
  display: inline-block;
}
/* .project_title .split-child {
  padding-top: 15px;
  margin-bottom: -15px;
} */
.project_title {
  overflow: inherit !important;
}

.swiper {
  width: 100%;
  height: 100%;
}

.swiper-slide {
  border-radius: 16px;
  overflow: hidden;
  height: 100%;
  width: unset !important;
}

.swiper-text {
  background-color: var(--black-words);
  padding: 48px 88px 48px 40px;
}
.swiper-text__inner {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.st__paragraph {
  font-size: 18px;
  line-height: 24px;
}
.st__subtitle {
  font-size: 14px;
  line-height: 18px;
  font-family: NeueHaasGrotesk;
}


.swiper-end {
  background-color: var(--black-words);
  margin-right: 40px;
}
.end__inner {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.end__wrapper {
  text-align: center;
}

.swiper-slide>img, .swiper-slide>video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.swiper-slide>video {
  z-index: 2;
  position: absolute;
  pointer-events: none;
}

.end__project {
  position: relative;
}

.end__next, .end__project div {
  font-size: 85px;
  line-height: .7;
  font-family: Beni;
  position: relative;
  transition: transform .4s ease;
}
.end__next {
  margin-bottom: 5px;
}
.end__next-project-name {
  position: relative;
  text-align: left;
  margin-top: 12px;
  opacity: 0;
  text-transform: uppercase;
  transition: transform .4s ease, opacity .4s ease;
}

.end__project svg {
  position: absolute;
  top: 5px;
  left: -40px;
  opacity: 0;
  transition: opacity .4s ease, left .4s ease;
}
.end__arrow-tail {
  stroke-dasharray: 60;
  stroke-dashoffset: 100;
  transition: stroke-dasharray .4s ease;
}

.swiper-end:hover .end__next {
  transform: translateX(-30px)
}
.swiper-end:hover .end__project div, .swiper-end:hover .end__next-project-name {
  transform: translateX(30px)
}
.swiper-end:hover .end__next-project-name {
  opacity: 1;
}

.swiper-end:hover .end__arrow-tail {
  stroke-dasharray: 50;
}
.swiper-end:hover .end__project svg {
  opacity: 1;
  left: -30px
}


.formato-vertical {
  aspect-ratio: 2 / 3;
}
.formato-horizontal {
  aspect-ratio: 3 / 2;
}
.formato-cuadrada {
  aspect-ratio: 1 / 1;
}

.pm__carousel {
  width: calc(100% - 37.5rem);
  height: 100%;
}
body:has(.pm__carousel:hover) #cursor {
  --size: 100px !important;
}
body:has(.pm__carousel:hover) #cursor span {
  transform: translate(-50%, -50%) scale(1);
  transition: all .5s ease;
}
body:has(.swiper-end:hover) #cursor {
  --size: 20px !important;
}
body:has(.swiper-end:hover) #cursor span {
  transform: translate(-50%, -50%) scale(0);
}



/* AVOID SCROLL ON MODALS */

body:not(.loaded),
body:has(.global.open-projects-modal),
body:has(.global.project-loading) {
  overflow: hidden !important;
}


/* CURSOR IMAGE */

#cursor {
  --max-size: 10px;
  --size: var(--max-size);
  position: fixed;
  top: calc(var(--size) / -2);
  left: calc(var(--size) / -2);
  width: var(--size);
  height: var(--size);
  background-color: var(--primary);
  border-radius: 50%;
  pointer-events: none;
  z-index: 999;
  transition: top 0.25s ease-out, left 0.25s ease-out, width 0.25s ease-out,
    height 0.25s ease-out;
}

#cursor span {
  color: var(--black);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  transition: all .4s ease;
}

body.touch-device #cursor {
  display: none !important;
}

#cursor-border {
  --size: 0px;
  position: fixed;
  top: calc(var(--size) / -2);
  left: calc(var(--size) / -2);
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  pointer-events: none;
  z-index: 998;
}

#cursor-image {
  --max-size: 19.5rem;
  --size: var(--max-size);
  width: var(--size);
  position: absolute;
  top: calc(var(--size) / -2);
  left: calc(var(--size) / -2);
  transition: top 0.25s ease, left 0.25s ease, width 0.25s ease,
    height 0.25s ease;
}

#cursor-image[src=""] {
  display: none;
}



.info__modal {
  display: flex;
  flex-direction: column;
  position: fixed;
  bottom: -100%;
  left: 0;
  width: 100vw;
  background-color: var(--black);
  padding: 0px 5rem 5.625rem 5rem;
  height: 43.75rem;
  transition: bottom .8s var(--animation-ease);
  border-top-left-radius: 3.75rem;
  border-top-right-radius: 3.75rem;
  z-index: 10;
}

.global.open-info-modal .info__modal {
  bottom: 0;
}


.im__veil {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: white;
  opacity: 0;
  pointer-events: none;
  transition: opacity .8s var(--animation-ease);
}

.global.open-info-modal .im__veil {
  opacity: .1;
  pointer-events: all;
}

.im__header {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2.75rem 0px 2.625rem;
  text-transform: uppercase;
  border-bottom: 1px solid var(--black-words);
}
.im__header a {
  color: var(--white);
  text-decoration: none !important;
  font-size: 14px;
  line-height: 18px;
}

.im__body {
  display: flex;
  height: 100%;
  width: 100%;
  padding-top: 5.625rem;
}

.im__body-left {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: transform .8s var(--animation-ease);
}
.global:not(.open-info-modal) .im__body-left {
  transform: translateY(100%);
}
.im__left-info {
  max-width: 28.125rem;
  font-size: 20px;
  line-height: 24px;
}


.im__body-right {
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  align-items: flex-end;
}

.im__right-experience {
  position: relative;
  width: max-content;
  display: grid; 
  grid-template-columns: 1fr 1fr; 
  grid-template-rows: 1fr 1fr; 
  gap: 1.5rem 1.875rem; 
  grid-template-areas: 
    ". ."
    ". ."; 
  
  margin-left: auto;
  margin-right: 8.75;
  z-index: 1;
}

.im__list {
  display: grid; 
  grid-template-columns: 6.25rem 1fr; 
  grid-template-rows: 1fr; 
  gap: 0px 0px; 
  grid-template-areas: 
    ". ."; 
  gap: 1rem;
  margin-bottom: 1.5rem;
  transition: transform .8s var(--animation-ease);
}
.global:not(.open-info-modal) .im__list:nth-of-type(1) {
  transform: translateY(18.75rem);
}
.global:not(.open-info-modal) .im__list:nth-of-type(2) {
  transform: translateY(25rem);
}
.global:not(.open-info-modal) .im__list:nth-of-type(3) {
  transform: translateY(37.5rem);
}

.im__list-wrapper.--bottom {
  transition: transform .8s var(--animation-ease);
}
.global:not(.open-info-modal) .im__list-wrapper.--bottom {
  transform: translateY(37.5rem);
}

.im__list:last-of-type {
  margin-bottom: 0;
}

.im__list-date {
  color: var(--primary);
  font-size: 14px;
  line-height: 16px;
  text-align: right;
}
.im__list-desc {
  font-size: 16px;
  line-height: 16px;
}

.im__list-name {
  font-family: NeueHaasGrotesk;
  padding-bottom: 8px;
}

.im__formation, .im__experience {
  font-size: 12.25rem;
  position: absolute; 
  color: var(--black-words);
  font-family: Beni;
  z-index: 0;
  transition: transform .8s var(--animation-ease);
}

.im__formation {
  top: -2.25rem;
  right: 21.25rem;
}
.global:not(.open-info-modal) .im__formation {
  transform: translateY(6.25rem);
}

.im__experience {
  top: 6.875rem;
  right: 0;
}
.global:not(.open-info-modal) .im__experience {
  transform: translateY(25rem);
}

.im__draw {
  margin-top: 1.125rem;
  margin-left: 7.5rem;
  stroke-dasharray: 880;
  stroke-dashoffset: 1320;
  transition: stroke-dasharray .74s var(--ease-svg) .5s;
}

.global.open-info-modal .im__draw {
  stroke-dasharray: 660;
}







html {
  font-size: 0.833vw;
}

@media screen and (max-width: 1500px) {
  html {
    font-size: 1.111vw;
  }

  .home__inner {
    width: 55rem;
    height: 36rem;
  }

  .name {
    top: 6.5rem;
    left: 5rem;
  }
  .surname {
    top: 2.3rem;
    left: 18.34rem;
  }  
  .designer {
    top: 10.6rem;
  }
  .graphic {
    top: 18.9rem;
    left: 11.4rem;
  }

  .home__smile {
    top: 17rem;
    left: 9.8rem;
    width: 7.875rem;
  }
  .home__arrow {
    top: 22rem;
    left: 33rem;
    width: 19rem;
  }

  .floating1, .floating2 {
    width: 17.188rem;
  }

  .home__img1 {
    top: -1rem;
    left: 34rem;
  }
  .home__img2 {
    top: 16rem;
    left: -1rem;
  }

  .home__tags {
    font-size: 12px;
    top: 29.8rem;
    width: 23.9rem;
    left: 11.6rem;
  }

  h1, .h1 {
    font-size: 12.375rem;
  }
  .project_title {
    font-size: 8.75rem;
  }
  .text, .number {
    font-size: 12px;
  }
  .header_link {
    font-size: 14px;
  }
  .header__logo img {
    height: 28px;
  }




  .projects {
    transform: translateY(-27%);
  }

  .projects__draw-top-left {
    top: 3rem;
    left: 8rem;
    height: 6.688rem;
  }
  .projects__draw-bottom-left {
    top: 24rem;
    left: 13rem;
    height: 4.813rem;
  }
  .projects__draw-top-right {
    top: 4rem;
    left: 78rem;
    height: 3.625rem;
  }
  .projects__draw-bottom-right {
    top: 20rem;
    left: 75rem;
    height: 8.475rem;
  }
  #cursor-image {
    --max-size: 14.5rem;
  }

  .project_arrow {
    width: 1.375rem;
    height: 1.375rem;
    left: -1.875rem;
    top: 0.713rem;
  }
  .projects__credits {
    bottom: 20px;
    font-size: 10px;
  }
  .row {
    gap: 5px 4.375rem;
  }






  /* FICHA */
  .pm__description {
    font-size: 18px;
    line-height: 22px;
  }
  .pm__tags {
    font-size: 12px;
  }
  .pm__title {
    font-size: 7.5rem;
    width: 70%;
  }
  .pm__info {
    width: 30rem;
  }
  .projects__modal, .projects__modal-out {
    border-top-left-radius: 2.5rem;
    border-top-right-radius: 2.5rem;
  }
  .pm__carousel {
    width: calc(100% - 30rem);
  }
  .pm__close-btn, .im__close-btn {
    --size: 2.6rem;
  }
  

  /* INFO */
  .im__formation, .im__experience {
    font-size: 8.75rem;
  }
  .im__experience {
    top: 4.275rem;
  }
  .im__left-info {
    max-width: 25rem;
    font-size: 18px;
    line-height: 22px;
  }
  .info__modal {
    padding: 0 2.25rem 3.75rem 2.25rem;
    height: 32.25rem;
    border-top-left-radius: 2.5rem;
    border-top-right-radius: 2.5rem;
  }
  .im__draw {
    height: 3.25rem;
    margin-top: 1.125rem;
    margin-left: 5.5rem;
  }
  .im__body {
    padding-top: 4.063rem;
  }

  .temp {
    display: none;
  }
  .im__right-experience {
    grid-template-rows: unset;
  }
  .im__list-wrapper.--bottom {
    margin-top: 3.938rem;
  }

  .im__header {
    padding: 1.875rem 0;
  }


  .h1.--aut {
    font-size: 64px;
  }
  .aut_1 {
    top: 0;
  }
  .aut_2 {
    top: 47px;
  }
  .aut__form {
    top: 118px;
  }
  .aut__svg {
    top: 125px;
    left: -30px;
    width: 200px;
  }
  .authentication .home__inner {
    height: 170px;
    width: 280px;
  }

}


@media screen and (min-width: 1025px) {
  .project_mobile-img {
    display: none;
  }
}
@media screen and (max-width: 1024px) {
  html {
    font-size: 1.563vw;
  }

  .project_title {
    font-size: 7.188rem;
  }

  h1, .h1 {
    font-size: 10.25rem;
  }

  .home__inner {
    width: 49rem;
    height: 32rem;
  }
  .surname {
    top: 3.3rem;
    left: 16rem;
  }
  .designer {
    top: 10rem;
    left: 15.98rem;
  }
  .graphic {
    top: 16.9rem;
    left: 10.4rem;
  }
  .home__smile {
    top: 15.3rem;
    left: 8.8rem;
    width: 6.275rem;
  }
  .home__arrow {
    top: 19.5rem;
    left: 28.2rem;
    width: 16rem;
  }
  .home__img1 {
    top: 1rem;
    left: 30rem;
  }
  .home__img2 {
    top: 15rem;
    left: 0rem;
  }
  .floating1, .floating2 {
    width: 14.188rem;
  }
  .home__tags {
    font-size: 10px;
    top: 25.8rem;
    width: 19.7rem;
    left: 10.6rem;
  }
  .header_link {
    font-size: 12px;
  }


  .row {
    padding: 0 30px;
  }
  .project_title {
    font-size: 7.188rem;
  }
  .projects__draw-top-left {
    top: 2rem;
    left: 1.3rem;
    height: 5.5rem;
  }
  .projects__draw-bottom-left {
    top: 20rem;
    left: 5rem;
    height: 4rem;
  }
  .projects__draw-top-right {
    top: 3rem;
    left: 60rem;
    height: 2.875rem;
  }
  .projects__draw-bottom-right {
    top: 17rem;
    left: 56rem;
    height: 7rem;
  }
  .projects__credits {
    font-size: 9px;
  }


  /* FICHA */
  .pm__title {
    font-size: 5.938rem;
  }
  .pm__description {
    font-size: 16px;
    line-height: 20px;
    padding-right: 1.875rem;
  }
  .pm__tags {
    font-size: 10px;
  }
  .pm__info-top {
    gap: 6px;
  }
  .pm__info {
    width: 100%;
    flex-direction: row;
  }
  .projects__modal, .projects__modal-out {
    flex-direction: column;
    padding: 3.125rem 0 3.125rem 1.875rem;
    gap: 3.125rem;
    border-top-left-radius: 2rem;
    border-top-right-radius: 2rem;
  }
  .pm__carousel {
    width: 100%;
    height: 23.125rem;
  }
  .end__next, .end__project div {
    font-size: 65px;
  }


  /* INFO */

  .im__left-info {
    max-width: 22.5rem;
    font-size: 16px;
    line-height: 20px;
  }
  .info__modal {
    padding: 0 1.75rem 3.125rem 1.75rem;
    height: 31.25rem;
    border-top-left-radius: 2rem;
    border-top-right-radius: 2rem;
  }
  .im__body {
    padding-top: 3rem;
  }
  .im__formation, .im__experience {
    font-size: 7.188rem;
  }
  .im__list-desc {
    font-size: 14px;
  }
  .im__list {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
    grid-template-areas: unset;
    gap: 4px;
  }
  .im__list-date {
    font-size: 12px;
    line-height: 14px;
    text-align: left;
  }
  .im__list-name {
    padding-bottom: 2px;
  }
  .im__formation {
    top: -1.25rem;
    right: 10.15rem;
  }
  .im__experience {
    top: 4rem;
  }
  .im__list-wrapper.--bottom {
    margin-top: 4.7rem;
  }
  .im__draw {
    height: 3rem;
    margin-left: 2.5rem;
  }
  .button {
    font-size: 12px;
  }


  .link:not(.project-clicked) .project_mobile-img {
    transform: translate(0px, 50px);
    opacity: 0;
  }
  .link .project_mobile-img {
    display: block;
    position: absolute;
    bottom: -30px;
    right: -40px;
    width: 140px;
    opacity: 1;
    transform: translate(0px, 0px);
    transition: all .5s ease;
  }
}

@media screen and (max-width: 920px), (orientation: portrait) {
  html {
    font-size: 2.083vw;
  }


 /*  .project-link .number, .project-link .text, .project_arrow {
    display: none;
  }.project-link .number, .project-link .text, .project_arrow {
    display: none;
  } */

  .projects__draw-top-left {
    top: -2rem;
    left: 5.3rem;
  }
  .projects__draw-bottom-left {
    top: 33rem;
    left: 7rem;
  }
  .projects__draw-top-right {
    top: -1rem;
    left: 39.5rem;
  }
  .projects__draw-bottom-right {
    top: 30rem;
    left: 36rem;
  }
  .projects {
    transform: translateY(-23%);
  }
  .projects__credits {
    display: none;
  }

  .pm__carousel {
    height: 18.125rem;
  }

  .info__modal {
    padding: 0;
    padding-bottom: 3.75rem;
    height: unset;
  }
  .im__body-left {
    align-items: flex-start;
    justify-content: space-between;
    padding: 0 10rem;
  }
  .im__body-right {
    padding: 0 10rem;
  }
  .im__body {
    gap: 8rem;
    flex-direction: column;
  }
  .im__draw {
    height: 2.563rem;
    margin-top: 1.25rem;
    margin-bottom: -1.875rem;
    margin-left: 13.5rem;
    width: 13.125rem;
  }
  .im__experience {
    top: 2rem;
    right: 10rem;
  }
  .im__formation {
    top: -3.25rem;
    right: 18.345rem;
  }
  .im__header {
    padding: 1.75rem;
  }

  .swiper-wrapper {
    height: unset !important;
  }
}

@media screen and (max-width: 769px), (orientation: portrait) {
  .pm__carousel {
    height: 28rem;
  }
}

@media screen and (min-width: 601px) {
  .designer.--mobile {
    display: none;
  }
}

.pm__inner-bg {
  display: none;
}
@media screen and (max-width: 600px) {


  h1, .h1 {
    font-size: 18.7rem;
  }

  .name {
    top: 0;
    left: 15px;
  }
  .surname {
    top: 5.3rem;
    left: unset;
    right: 15px;
  }

  .designer {
    top: 18rem;
    left: 15px;
  }
  .designer.--desktop {
    display: none;
  }

  .graphic {
    top: 30.4rem;
    left: unset;
    right: 15px;
  }
 .project-link .text {
    display: none;
  }

  .home__tags {
    font-size: 10px;
    top: 46.8rem;
    width: 36rem;
    left: unset;
    right: 20px;
  }

  .number {
    left: -2.275rem;
    top: 1rem;
    font-size: 12px;
  }
  .project_arrow {
    width: 16px;
    height: 16px;
    left: -18px;
    top: 10px;
  }

  .home__inner {
    width: 100%;
    height: 52rem;
  }

  .home__smile {
    top: 16.3rem;
    left: 8.8rem;
    width: 10.275rem;
  }
  .home__arrow {
    top: 27.5rem;
    left: unset;
    width: 24rem;
    right: 15px;
  }

  .home__img1 {
    top: -11rem;
    left: 24rem;
  }
  .home__img2 {
    top: 25rem;
    left: -8rem;
  }

  .im__veil {
    z-index: 9;
  }

  .projects {
    transform: translateY(-34%);
  }
  .projects__credits {
    display: inherit;
  }

  .projects__draw-top-left,
  .projects__draw-bottom-left,
  .projects__draw-top-right,
  .projects__draw-bottom-right {
    display: none;
  }

  .home, .projects {
    height: unset !important;
    overflow: unset !important;
  }
  .home, .projects, .grid, .row {
    width: 100% !important;
  }
  .home {
    padding-top: 160px;
  }
  .projects {
    transform: unset;
    padding-top: 100px;
    padding-bottom: 47vh;
    position: relative;
  }

  .floating1, .floating2 {
    width: 25rem;
  }

  .projects__credits {
    display: inline;
    width: 150px;
    line-height: 14px;
    text-align: center;
    text-wrap: balance;
  }
  .project-link .project_title {
    text-wrap: wrap !important;
  }
  .project_title {
    font-size: 115px;
    line-height: 80px;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    white-space: normal;
  }
  .row {
    padding: 0 40px !important;
    gap: 20px !important;
    justify-content: flex-start !important;
  }
  .header_link svg {
    transform: translate(-10px, -50%);
  }
  .projects__gradient {
    pointer-events: none;
  }

  .im__body-left, .im__body-right {
    padding: 0 16px;
  }
  .im__left-info {
    max-width: 100%;
  }
  .im__draw {
    height: 12.563rem;
    margin-top: -3rem;
    margin-bottom: -64px;
    margin-left: 16.5rem;
    width: 27.125rem;
  }


  .im__right-experience {
    width: 100%;
    margin: 0;
  }
  .im__list-wrapper.--bottom {
    margin-top: 7.1rem;
  }
  .im__formation, .im__experience {
    font-size: 15rem;
    color: var(--dark-gray);
  }
  .im__formation {
    top: -3.25rem;
    right: unset;
    left: 16px;
  }
  .im__experience {
    top: 7rem;
    right: unset;
    left: 16px;
  }
  .im__header {
    padding: 24px 16px;
    border-bottom: 1px solid var(--dark-gray);
  } 



  .pm__info {
    flex-direction: column;
    justify-content: unset;
    gap: 30px;
  }
  .pm__description {
    width: 100%;
    max-width: unset;
    padding-right: unset;
  }
  .pm__title {
    font-size: 95px;
  }

  .pm__inner {
    display: block;
    width: 100%;
    background-color: var(--black);
    margin-top: 180px;
    z-index: 10;
    flex-direction: column;
    padding: 24px 0px 0px;
    border-top-left-radius: 2rem;
    border-top-right-radius: 2rem;
    gap: 60px;
    clear: both;
  }

  .pm__description {
    margin-bottom: 60px;
  }

  /* .pm__inner-bg {
    bottom: 0;
    left: 0;
    width: 100%;
    height: calc(100%);
    z-index: 9;
    display: block;
    position: fixed;
    background-color: var(--black);
    transition: transform .8s var(--animation-ease);
    transform: translateY(100%);
  }
  .pm__inner-bg.not-top {
    height: calc(100% - 250px);
  }

  .global.open-projects-modal .pm__inner-bg {
    transform: translateY(0%);
  }

  .pm__inner {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
  } */

  .pm__info {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .pm__carousel {
    clear: both;
  }
  /* .pm__carousel .swiper {
    
    background-color: var(--black) !important;
  } */

  .swiper-slide {
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-bottom: 16px !important;
    border-radius: 0 !important;
    position: relative !important;
    transform: unset !important;
    flex-shrink: unset !important;
    overflow: unset !important;
  }
  .swiper-slide .video-cover, .swiper-slide img {
    border-radius: 12px !important;
    /* position: relative; */
  }
  .swiper-slide:not(swiper-end) {
    background-color: var(--black) !important;
  }
  .end__inner {
    border-radius: 12px !important;
    background-color: #262626 !important;
  }

  .swiper-end:after {
    position: relative;
  }
  .swiper-text {
    aspect-ratio: unset !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    height: max-content !important;
  }
  .swiper-text__inner {
    background-color: #262626 !important;
    border-radius: 12px !important;
    padding: 30px 40px 20px 20px;
  }
  .swiper-slide>video {
    position: relative;
    border-radius: 12px;
  }
  /* .swiper-slide .video-cover:after, .swiper-slide img:after, .swiper-end:after {
    content: '';
    width: 100vw;
    height: 16px;
    background-color: var(--black) !important;
    position: absolute;
    z-index: 100;
    bottom: -16px;
    left: 0px;
  } */
  .swiper-slide::after {
    content: '';
    background-color: var(--black);
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 16px;
  }
  /* .swiper-slide:before {
    content: '';
    width: 100vw;
    height: 16px;
    background-color: var(--black) !important;
    position: absolute;
    z-index: 100;
    top: -16px;
    left: 0px;
  } */

  .projects__modal, .projects__modal-out {
    background-color: unset !important;
    padding: 0;
    border-top-left-radius: 0;
    overflow-y: scroll;
    height: 100%;
  }

  .swiper-notification {
    display: none !important;
  }

/*   .pm__close-btn__wrapper {
    z-index: 11;
  } */

  .pm__carousel {
    height: unset !important;
    background-color: var(--black);
  }

  .global.open-projects-modal .global__inner {
    overflow: hidden !important;
  }

  .swiper-wrapper {
    flex-direction: column;

  }
  .swiper {
    overflow: unset !important;
  }
  .swiper-slide {
    width: 100% !important;
    margin: 0;
    margin-bottom: 16px;
  }
  .pm__carousel-bottom-gap {
    height: 16px;
  }


  /* .authentication .reveal-title {
    font-size: 95px;
  }

  .aut_1 {
    top: 4.05rem;
  }
  
  .aut_1, .aut_2, .aut__form {
    left: 16px;
  }

  .aut__form {
    top: 23.5rem;
  }

  .aut__svg {
    top: 27rem;
    left: 5.3rem;
    width: 45.51vw;
  } */
  .aut__form input {
    width: 210px;
  }

  .global.autentication .home {
    padding-top: 30vh;
  }


  /* .formato-vertical.swiper-slide {
    aspect-ratio: unset;
  } */
  .formato-vertical.swiper-slide.swiper-end {
    aspect-ratio: 3 / 2;
  }
  .video-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
  }
  .st__subtitle {
    display: none;
  }
  .swiper-text {
    padding: 32px 24px;
    height: unset !important;
  }
  .pm__info {
    height: unset !important;
  }

  .end__next-project-name {
    font-size: 12px;
  }

  .header {
    padding: 0 16px;
    height: 65px;
  }

  .global.authentication .home {
    padding-top: calc(50vh - 130px);
  }
  .aut__svg {
    top: 165px;
  }
  .link {
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    display: block !important;
    white-space: normal;
  }
  .content {
    width: 100vw;
  }

  .end__next-project-name {
    opacity: 1 !important;
  }

  body:has(.open-info-modal) {
    overflow: hidden;
  }
}