.m-headline {
    position: relative;
    display: var(--display);
    grid-template-columns: repeat(12, 1fr);
    width: 100%;
    height: fit-content;
}

.m-headline .m-headline-inner {
    position: relative;
    display: flex;
    flex-flow: column;
    grid-column: var(--size);
    width: 100%;
    height: fit-content;
    padding: var(--paddingTop) var(--lateralMargin) var(--paddingBottom);
}

.m-headline .m-headline-inner.m-headline-inner-sm {
    display: none;
}

.m-headline .m-headline-inner .item {
    position: relative;
    display: block;
}

.m-headline .m-headline-inner .item .line {
    position: relative;
    display: block;
}

.m-headline .m-headline-inner .item .line .word {
    opacity: 0;
    transform: translate(0,10%) rotate(1deg);
 
    transition: 
        opacity .4s cubic-bezier(.65,0,.5,1) 0s,
        transform .0s cubic-bezier(.65,0,.5,1) .41s;
}

.m-headline .m-headline-inner .item .line .word.revealed {
    opacity: 1;
    transform: translate(0,0%) rotate(0deg);
    transition: 
        opacity .4s cubic-bezier(.65,0,.5,1) var(--delay),
        transform .4s cubic-bezier(.65,0,.5,1) var(--delay);
}


@media only screen and (max-width: 980px) {
    .m-headline {
        grid-template-columns: repeat(6, 1fr);
        display: var(--displaySM);
    }

    .m-headline .m-headline-inner {
        grid-column: var(--sizeSM);
        padding: var(--paddingTopSM) var(--lateralMargin) var(--paddingBottomSM);
    }

    .m-headline .m-headline-inner .item {
        font-size: 7.02vw;
    }
}