@keyframes first-text{0%{top:100%}8.33%{top:0}50%{top:0}58.3%{top:-100%}to{top:-100%}}@keyframes second-text{0%{top:100%}41.6%{top:100%}50%{top:0}91.6%{top:0}to{top:-100%}}@property --text-width{syntax:"<length-percentage>";initial-value:100%;inherits:false}@keyframes line-width{0%{--text-width:var(--first-text-width)}41.6%{--text-width:var(--first-text-width)}58.33%{--text-width:var(--last-text-width)}to{--text-width:var(--last-text-width)}}.mod-hero-homepage .hero{--mask-height:70%;--line-offset:6rem;height:calc(100vh*var(--viewport-factor));height:calc(100svh*var(--viewport-factor));min-height:60rem;overflow:hidden;position:relative}.mod-hero-homepage .media-mask{height:var(--mask-height);inset:0;overflow:hidden;position:absolute;width:100%}.mod-hero-homepage .background-image img{height:100%;object-fit:cover;width:100%}.mod-hero-homepage .background-video{height:100%;inset:0;position:absolute;width:100%}.mod-hero-homepage .background-video .youtube-video{height:100%;position:relative}.mod-hero-homepage .background-video .iframe{inset:50%;position:absolute;transform:translate(-50%,-50%)}.mod-hero-homepage .title{font-size:clamp(5rem,calc(6vw*var(--viewport-factor)),13rem);font-weight:300;left:var(--container-gutter-x);line-height:1;margin:0;position:absolute;text-transform:uppercase;top:calc(var(--mask-height) - 1.35em);width:calc(100% - var(--container-gutter-x)*2);z-index:1}.mod-hero-homepage .title .line{animation-delay:1.8s;animation-direction:alternate;animation-duration:calc(var(--animation-duration-transition)*1 + var(--animation-duration-hold)*1);animation-iteration-count:var(--animation-iteration-count);animation-name:line-width;animation-timing-function:var(--animation-timing-function);background-color:var(--color-primary);bottom:.15em;content:"";display:block;height:.1rem;position:absolute;right:0;transition:width var(--transition-base);width:calc(100% - var(--text-width) - var(--line-offset));z-index:-1}.mod-hero-homepage .title.animation{--animation-duration-transition:0.4s;--animation-duration-hold:2s;--animation-duration-hold-hidden:calc(var(--animation-duration-hold) - var(--animation-duration-transition));--animation-duration-first-text:calc(var(--animation-duration-transition)*2 + var(--animation-duration-hold)*2);--animation-duration-second-text:calc(var(--animation-duration-transition)*2 + var(--animation-duration-hold)*2);--animation-timing-function:cubic-bezier(.46,.24,.69,.92);--animation-iteration-count:infinite;height:3em}.mod-hero-homepage .title.animation .title-block{height:3em;left:0;position:absolute;top:0;width:100%}.mod-hero-homepage .title.animation .mask{height:1em;overflow:hidden;position:relative}.mod-hero-homepage .title.animation .mask .text{left:0;position:absolute;top:100%}.mod-hero-homepage .title.animation .title-block:first-child .mask:first-child .text{animation:var(--animation-duration-first-text) var(--animation-timing-function) 0s var(--animation-iteration-count) first-text}.mod-hero-homepage .title.animation .title-block:first-child .mask:nth-child(2) .text{animation:var(--animation-duration-first-text) var(--animation-timing-function) .2s var(--animation-iteration-count) first-text}.mod-hero-homepage .title.animation .title-block:first-child .mask:nth-child(3) .text{animation:var(--animation-duration-first-text) var(--animation-timing-function) .4s var(--animation-iteration-count) first-text}.mod-hero-homepage .title.animation .title-block:nth-child(2) .mask:first-child .text{animation:var(--animation-duration-second-text) var(--animation-timing-function) calc(var(--animation-duration-transition)) var(--animation-iteration-count) second-text}.mod-hero-homepage .title.animation .title-block:nth-child(2) .mask:nth-child(2) .text{animation:var(--animation-duration-second-text) var(--animation-timing-function) calc(.2s + var(--animation-duration-transition)) var(--animation-iteration-count) second-text}.mod-hero-homepage .title.animation .title-block:nth-child(2) .mask:nth-child(3) .text{animation:var(--animation-duration-second-text) var(--animation-timing-function) calc(.4s + var(--animation-duration-transition)) var(--animation-iteration-count) second-text}@media (max-width:768px){.mod-hero-homepage .hero{--mask-height:80%;--line-offset:1.2rem}}