/*
Theme Name: Impreza Child
Template: Impreza
Version: 1.0
Author:	UpSolution
Theme URI: http://impreza.us-themes.com/
Author URI: http://us-themes.com/
*/



.wipe h1{
  height: 100%;
  width: 100%;
  object-fit: cover;
  transform-origin: left;
}
.wipe{
  visibility: hidden;
  position: relative;
  width: 80%;
  height: 80%;
  max-width: 500px;
  overflow: hidden;
}






/*Customise*/
.l-section.width_full{overflow:hidden;}
html{-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.l-section.width_full{
	/*overflow:hidden;*/
}

/*SPLIT*/

.splitting .char, .splitting .word {
    display:inline-block
}

.splitting .char {
    
}

.splitting .char:after, .splitting .char:before {
    content: attr(data-char);
    position: absolute;
    top: 0;
    left: 0;
    visibility: hidden;
    transition: inherit;
    user-select:none
}

.splitting {
    --word-center: calc((var(--word-total) - 1) / 2);
    --char-center: calc((var(--char-total) - 1) / 2);
    --line-center:calc((var(--line-total) - 1) / 2)
}

.splitting .word {
    --word-percent: calc(var(--word-index) / var(--word-total));
    --line-percent:calc(var(--line-index) / var(--line-total))
}

.splitting .char {
    --char-percent: calc(var(--char-index) / var(--char-total));
    --char-offset: calc(var(--char-index) - var(--char-center));
    --distance: calc((var(--char-offset) * var(--char-offset)) / var(--char-center));
    --distance-sine: calc(var(--char-offset) / var(--char-center));
    --distance-percent:calc((var(--distance) / var(--char-center)))
}

@supports (display: grid) {
    .splitting.cells {
        position: relative;
        overflow: hidden;
        background-size: cover;
        visibility:hidden
    }

    .splitting .cell-grid {
        background: inherit;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: grid;
        grid-template:repeat(var(--row-total), 1fr)/repeat(var(--col-total), 1fr)
    }

    .splitting .cell {
        background: inherit;
        position: relative;
        overflow:hidden
    }

    .splitting .cell-inner {
        background: inherit;
        position: absolute;
        visibility: visible;
        width: calc(100% * var(--col-total));
        height: calc(100% * var(--row-total));
        left: calc(-100% * var(--col-index));
        top:calc(-100% * var(--row-index))
    }

    .splitting .cell {
        --center-x: calc((var(--col-total) - 1) / 2);
        --center-y: calc((var(--row-total) - 1) / 2);
        --offset-x: calc(var(--col-index) - var(--center-x));
        --offset-y: calc(var(--row-index) - var(--center-y));
        --distance-x: calc((var(--offset-x) * var(--offset-x)) / var(--center-x));
        --distance-y:calc((var(--offset-y) * var(--offset-y)) / var(--center-y))
    }
}


/**/
[data-scroll] {
  opacity: 0;
  will-change: transform, scale, opacity;
  transform: translateX(1rem) scale(0.93);
  transition: all 1.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

[data-scroll=in] {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.splitting .char {
  color: transparent;
}
.splitting .char:after {
  visibility: visible;
  color: #4b2259;
  opacity: 0;
  transform: translateX(10%);
  transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition-delay: calc(.2s + (.03s * var(--char-index) ) );
}

[data-scroll=in] .char:after {
  opacity: 1;
  transform: translateY(0);
}




/*

.img-reveal img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  transform-origin: left;
}
.img-reveal .reveal {
  visibility: hidden;
  position: relative;
  width: 80%;
  height: 80%;
  max-width: 500px;
  overflow: hidden;
}

/*Parallax
.pwrapper {
	position: relative;
	height: 100%;
	overflow: hidden;
}
.pbackground{
	overflow: hidden;
}
.pbackground .vc_column-inner{
	background-size: cover;
	position: relative;
	background-position: center;
	background-repeat: no-repeat;
	height: 120%;
}
/*Parallax*/