* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: "Aclonica", sans-serif;
    background: #ffffff;
    color: #333;
    user-select: none;
    -webkit-user-select: none;
}

/* HERO */

.hero {

    min-height: 100vh;

    display: flex;
    align-items: center;
    justify-content: center;

    text-align: center;

    background:
        radial-gradient(circle at 15% 25%, #FFA62E33, transparent 40%),
        radial-gradient(circle at 85% 70%, #0074D933, transparent 40%),
        radial-gradient(circle at 60% 10%, #F71B3D22, transparent 50%),
        #ffffff;

}

/* CONTENT */

.content {
    max-width: min(92vw, 750px);
    padding: clamp(14px, 3vw, 24px);
    transform: translateY(clamp(-18vh, -10vh, -6vh));
}

.logo {
    width: clamp(180px, 36vw, 320px);
    height: auto;
    display: block;
    max-width: 80%;
    margin-inline: auto;
    margin-bottom: clamp(40px, 10vw, 100px);
}

h1 {
    font-size: clamp(18px, 2.2vw, 24px);
    color: #333333;
    margin-bottom: clamp(14px, 2.4vw, 20px);
}

/* TERMINAL */

.terminal {
    font-family: "JetBrains Mono", monospace;
    background: #f8f9fb;
    border-radius: clamp(8px, 1vw, 10px);
    padding: clamp(14px, 2.8vw, 25px);
    text-align: left;
    margin-bottom: clamp(36px, 7vw, 65px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
    border: 1px solid #bebebe;
    font-size: clamp(12px, 1.5vw, 16px);
    overflow-wrap: break-word;
    word-break: break-word;
}

.prompt {
    color: #F71B3D;
    margin-right: clamp(4px, 0.8vw, 6px);
    font-weight: 600;
}

.cursor {

    display: inline-block;
    margin-left: clamp(2px, 0.6vw, 4px);
    width: 0.65ch;
    height: 1em;
    vertical-align: -0.12em;
    background: #FFA62E;
    animation: blink 1s infinite;

}

@keyframes blink {

    0%,
    50%,
    100% {
        opacity: 1
    }

    25%,
    75% {
        opacity: 0
    }

}

/* TEXT */

.stay-tuned {
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    color: #FFA62E;
    font-size: clamp(13px, 1.6vw, 16px);
    letter-spacing: clamp(2px, 0.45vw, 3px);
    margin-bottom: clamp(8px, 1.5vw, 10px);
}

.coming {
    font-family: "Aclonica", sans-serif;
    font-size: clamp(17px, 2.2vw, 22px);
    font-weight: 600;
    color: #0074D9;
    text-decoration: underline;
    text-decoration-color: #F71B3D;
    text-underline-offset: clamp(5px, 1vw, 8px);
}

@media (max-width: 932px) and (orientation: landscape) {

    .content {
        transform: translateY(-4vh);
    }

    .logo {
        width: auto;
        max-width: min(68vw, 300px);
        max-height: 20vh;
        margin-bottom: clamp(16px, 3vh, 28px);
    }

    .terminal {
        margin-bottom: clamp(20px, 4vh, 36px);
    }

}
