@charset "utf-8";
/* CSS Document REVEAL TEXT */



@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
	
	.s-hero {
	  position: fixed;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  font-family: "Montserrat", serif;
	  background: #FFCC99; /* COLOR FRONTAL FONDO */
	  color: #fff; /* COLOR FUENTE FRONTAL */
	  cursor: none;
	}
	
	.s-hero .s__catcher {
	  position: absolute;
	  top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
	  text-align: center;
	  width: 100%;
	  font-weight: 900; /* GROSOR DE TIPOGRAFIA */
	  font-size: 8vw;
	  letter-spacing: -0.025em;
	  line-height: 85%;
	  opacity: 1; /*TRANSPARECIA EN EL TEXTO */
	}
	
	.s-scene {
	  position: fixed;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  background: #6699FF; /* COLOR FONDO */
	  -webkit-mask: url(#mask);
			  mask: url(#mask);
	  color: #FFF; /* COLOR TEXTO FONDO */
	  pointer-events: none;
	}
	
	.s-scene .s__title__line:nth-child(2) {
	  margin-left: auto;
	}
	.s-scene .s__word {
	  --max-scale: 3;
	  display: flex;
      align-items: center;
      justify-content: center;
	  width: 100%;
	  flex-direction: row;
	  font-family: "Montserrat", serif; /* TEXTO */
	  font-size: 20vw;
	  font-weight: 900;
	  font-style: normal;
	  text-transform: uppercase;
	  
	}
	@-webkit-keyframes char-scale {
	  0% {
		scale: 1 0.1;
	  }
	  50% {
		scale: 1 var(--max-scale);
	  }
	  100% {
		scale: 1 0.1;
	  }
	}
	@keyframes char-scale {
	  0% {
		scale: 1 0.1;
	  }
	  50% {
		scale: 1 var(--max-scale);
	  }
	  100% {
		scale: 1 0.1;
	  }
	}
	.s-scene .s__word__char {
	  -webkit-animation: char-scale 1.25s cubic-bezier(0.65, 0, 0.35, 1) infinite;
			  animation: char-scale 1.25s cubic-bezier(0.65, 0, 0.35, 1) infinite;
	  transform-origin: 50% 86.5%;
	}
	.s-scene .s__word__char:nth-child(1) {
	  color: #fe6319;
	}
	.s-scene .s__word__char:nth-child(2) {
	  color: #ff68a8;
	  -webkit-animation-delay: 0.25s;
			  animation-delay: 0.25s;
	}
	.s-scene .s__word__char:nth-child(3) {
	  color: #009800;
	  -webkit-animation-delay: 0.5s;
			  animation-delay: 0.5s;
	}
	
	.cursor {
	  position: fixed;
	  top: -1.5vw;
	  left: -1.5vw;
	  z-index: 2;
	  width: 8vw;
	  height: 8vw;
	  background: #FFF; /* COLOR CURSOR */
	  border-radius: 50%;
	  transform: translate3d(var(--x), var(--y), 0);
	  pointer-events: none;
	}

	
	
	.s-svg {
	  position: fixed;
	  top: 0;
	  left: 0;
	  z-index: 3;
	  width: 100%;
	  height: 100%;
	  pointer-events: none;
	}
	
	.imagen{
		display: flex;
        align-items: center;
        justify-content: center;
		width: 100%;
	    height: 100%;
		}
		
	.imagen img {
	   max-width: 100%;
	   height: auto;
	}