/* REMOVE LATER, NOT FINAL, WIP !!! */
:root {
    line-height: 1.5;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}

a {
    position: relative;

    &:link {
        color: rgb(255, 168, 168);
    }

    &:visited {
        color: rgb(155, 230, 174);
    }

    &:hover {
        color: rgb(255, 228, 193);
    }

    &[target="_blank"]::after {
        content: "(new tab)";
        display: inline-block;
        position: absolute;
        font-size: 0.6rem;
        top: -9px;
        right: -12px;
    }
}


body {
    background: #7e69ae;
    height: 100dvh;
    display: grid;
    
}

.wrapper {
    display: flex;
    flex-direction: column;
    padding: 2rem;
    place-self: center;
    background: linear-gradient(
        rgba(255, 85, 99, 0.411) 25%, rgba(170, 13, 104, 0.288)
    );
    border-radius: 25px;
    box-shadow: rgba(64, 10, 75, 0.377) 0 4px 10px;
}

h1 {
    color: #fee4eb;
    place-self: center;
    text-shadow: #5e4373 2px 2px 2px;

    &:hover {
        color: pink;
        text-shadow: #925162 2px 2px 2px;
    }
}

p {
    color: #fee4eb;
    text-shadow: #5e4373 2px 2px 2px;
    place-self: center;
    width: clamp(15ch, 40ch, 75%%);
    font-size: clamp(10px, 1rem, 5rem);
}

span {
    color: rgb(255, 143, 231);
    
    &:hover {
        color: pink;
        text-shadow: #925162 2px 2px 2px;
    }
}