.module-hero {
    position: relative;
    z-index: 1;
}

.module-hero .component-wrapper {
    position: relative;
    display: block;
    width: 100%;
	height: calc( var(--vhFlexible, 1vh) * 100 );
    background-color: var(--black);
    overflow: hidden;
    transition: background .4s ease;
	-webkit-transition: background .4s ease;
	-moz-transition: background .4s ease;
	-o-transition: background .4s ease;
}

.module-hero .component-wrapper .component-inner {
    position: fixed;
    display: flex;
    width: 100%;
	height: calc( var(--vhFlexible, 1vh) * 100 );
    padding: 0 var(--lateralMargin);
    align-items: center;
}

.module-hero .component-wrapper .component-inner h1 {
    position: relative;
    display: block;
    /*width: 70vw;*/
    width: 63vw;
	height: fit-content;
    /*transform: translate(0, -2vw);*/
    transition-delay: .4s;
}

.module-hero .component-wrapper .component-inner h1 .anchor {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: .52vw;
    cursor: pointer;
}


@media screen and (max-width: 1280px) {
    .module-hero .component-wrapper .component-inner h1 {
        width: 76vw;
        /*transform: translate(0, -1vw);*/
    }
}

@media only screen and (max-width: 1024px) {
    .module-hero .component-wrapper .component-inner h1 {
        width: 82vw;
    }
}


@media only screen and (max-width: 740px) {
    .module-hero .component-wrapper .component-inner {
        height: fit-content;
        min-height: 100vh;
        padding: 0 calc(var(--lateralMargin) * 1) 0 var(--lateralMargin);
    }

    .module-hero .component-wrapper .component-inner h1 {
        /*width: 98%;*/
		width: 75vw;
        transform: translate(0, -3vw);
    }
}

@media only screen and (max-width: 550px) {
    .module-hero .component-wrapper .component-inner h1 {
        transform: translate(0, -4vw);
    }
}