﻿/*

    01000011 01110010 01100101 01100001 01110100 01101111 01110010 00101110
    01000011 01101000 01011010 00101110 00110001 00111001 00111000 00110100

             © 2025 Manifestra. The Genesis of your Digital Future

    00101110 01001111 01110010 01101001 01100111 01101001 01101110 00101110
    11001111 10110110 00100000 00110001 00101110 00110110 00110001 00111000

*/

html, body {
    width: 100vw;
    height: 100vh;
    margin: 0;
    padding: 0;
    background: #15151E; /* McLaren Black */
    overflow: hidden;
}

#AnimationCanvas {
    display: block;
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 0;
    background: #15151E;
}

.branding {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-family: 'Segoe UI', system-ui, Arial, sans-serif;
    font-size: 4rem;
    color: #C7C9CB; /* McLaren Silver */
    text-align: center;
    opacity: 0;
    white-space: normal; /* Fix spacing issue */
    letter-spacing: 0; /* Remove extra letter spacing */
    z-index: 10;
    pointer-events: none;
    transition: opacity 0.5s;
}

.branding.visible {
    opacity: 1;
    animation: buildText 2.5s cubic-bezier(.47,1.64,.41,.99) 1;
}

.branding .domain {
    font-family: 'Segoe UI Semibold', system-ui, Arial, sans-serif;
    background: linear-gradient(90deg, #512BD4 0%, #2385FB 50%, #0ACF83 100%);
    background-size: 200% 100%;
    background-repeat: no-repeat;
    background-position: 0% 0%;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    font-weight: bold;
    text-shadow: none;
    margin: 0;
    padding: 0;
    display: inline;
}

.branding .manifestra {
    color: #8C8C8C; /* McLaren Silver */
    text-shadow: none !important;
    filter: none !important;
    font-weight: bold;
    margin: 0;
    padding: 0;
    display: inline;
}

.dot {
    color: #68217A; /* VS 2022 Purple */
    text-shadow: none;
}

.branding .net {
    font-family: 'Segoe UI Semibold', system-ui, Arial, sans-serif;
    background: linear-gradient(90deg, #512BD4 0%, #2385FB 50%, #0ACF83 100%);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: 0% 0%;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    font-weight: bold;
    text-shadow: none;
    filter: none;
    margin: 0;
    padding: 0;
    display: inline;
}

@keyframes buildText
{
    0%
    {
        opacity: 0;
        filter: blur(24px);
        text-shadow: 0 0 48px #00ff41, 0 0 0 #512BD4;
    }

    40%
    {
        opacity: 1;
        filter: blur(8px);
        text-shadow: 0 0 64px #00ff41, 0 0 16px #512BD4;
    }

    70%
    {
        opacity: 1;
        filter: blur(2px);
        text-shadow: 0 0 24px #00ff41, 0 0 4px #512BD4;
    }

    100%
    {
        opacity: 1;
        filter: blur(0);
        text-shadow: 0 2px 8px #00ff41;
    }
}