
:root {
    --orange: #fb5600;
    --white: #fff;
    --black: #000;
    --cream: #F7EAD1;
    --choco: #412120;
    --blue: #0700EE;
    --slight-blue: #DFDEFF;
    --green: #59FF26;
}

@media (hover: hover) {

[data-framer-name="orange"] [data-framer-name="main-about"] p > a.framer-text {
    position: relative;

    &::after {
        content: '';
        width: 100%;
        height: 1px;
        position: absolute;
        bottom: 0;
        left: 50%;
        background-color: var(--orange);
        transition: all 0.2s cubic-bezier(0.78, 0, 0.22, 1);
        transform: translate(-50%, -50%);
        z-index: 1;
        border-radius: 50px;
    }

    &::before {
        content: '';
        position: absolute;
        top: 3px;
        left: 0;
        z-index: 2;
        color: var(--cream);
        opacity: 0;
        transition: all 0.2s cubic-bezier(0.78, 0, 0.22, 1);
        line-height: 1;
    }

    &:nth-child(1) {
        &::before {
            content: 'Nauticare';
        }

        &:hover {
            &::before {
                opacity: 1;
            }
        }
    }

    &:nth-child(2) {
        &::before {
            content: 'Togetherise';
        }

        &:hover {
            &::before {
                opacity: 1;
            }
        }
    }

    &:nth-child(3) {
        &::before {
            content: 'Playable Revolution';
        }

        &:hover {
            &::before {
                opacity: 1;
            }
        }
    }

    &:nth-child(4) {
        &::before {
            content: 'Kanso';
        }

        &:hover {
            &::before {
                opacity: 1;
            }
        }
    }

    &:hover {
        color: var(--cream);

        &::after {
            height: 110%;
            bottom: 50%;
            width: 110%;
            transform: translate(-50%, 50%);
        }
    }
}


[data-framer-name="blue"] p > a.framer-text {
    position: relative;
    display: inline-block;
    transform: scale(1);
    transition: all 0.2s cubic-bezier(0.78, 0, 0.22, 1);

    &::after {
        content: '';
        width: 100%;
        height: 1px;
        position: absolute;
        bottom: -3px;
        left: 50%;
        background-color: var(--white);
        transition: all 0.2s cubic-bezier(0.78, 0, 0.22, 1);
        transform: translate(-50%, 0);
    }

    &:hover {
        color: var(--white);
        transition: all 0.2s cubic-bezier(0.78, 0, 0.22, 1);
        transform: scale(0.9);

        &::after {
            height: 3px;
            z-index: -1;
            bottom: -5px;
            width: 50%;
            transition: all 0.2s cubic-bezier(0.78, 0, 0.22, 1);
        }
    }
}




[data-framer-name="gum"] p > a.framer-text {
    position: relative;
    display: inline-block;
    transform: scale(1);
    transition: all 0.2s cubic-bezier(0.78, 0, 0.22, 1);
    text-decoration: none;

    &::after {
        content: '';
        width: 100%;
        height: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        background-color: var(--white);
        transition: all 0.3s linear(0, 0.402 7.4%, 0.711 15.3%, 0.929 23.7%, 1.008 28.2%, 1.067 33%, 1.099 36.9%, 1.12 41%, 1.13 45.4%, 1.13 50.1%, 1.111 58.5%, 1.019 83.2%, 1.004 91.3%, 1);
        transform: translate(-50%, -50%) scale(0);
        z-index: -1;
        transform-origin: center;
    }

    &:hover {
        color: var(--white);
        transition: all 0.2s cubic-bezier(0.78, 0, 0.22, 1);
        transform: scale(1.1);
        z-index: 10;
        text-decoration: none;

        &::after {
            height: 100%;
            top: 50%;
            left: 50%;
            width: 120%;
            transition: all 0.3s linear(0, 0.402 7.4%, 0.711 15.3%, 0.929 23.7%, 1.008 28.2%, 1.067 33%, 1.099 36.9%, 1.12 41%, 1.13 45.4%, 1.13 50.1%, 1.111 58.5%, 1.019 83.2%, 1.004 91.3%, 1);
            transform: translate(-50%, -50%) scale(1);
            background: #e55933;
            border-radius: 50px;
        }
    }


    [data-framer-name="header"] p {
        line-height: 1.5;
    }
}

}