* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    min-height: 100%;
}

body {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 2rem;

    background:
        radial-gradient(
            circle at top,
            #2a1d38 0%,
            #17121f 35%,
            #0d0d0f 100%
        );

    color: #f5f5f5;

    font-family:
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    text-align: center;
}

.container {
    width: 100%;
    max-width: 700px;
}

.eyebrow {
    margin-bottom: 1.2rem;

    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.18em;

    opacity: 0.7;
}

h1 {
    margin: 0;

    font-size:
        clamp(
            3rem,
            12vw,
            6rem
        );

    line-height: 0.95;
    letter-spacing: -0.05em;
}

.tagline {
    margin:
        1.25rem 0
        2rem;

    font-size:
        clamp(
            1.3rem,
            5vw,
            1.8rem
        );

    font-weight: 600;
}

.description {
    max-width: 620px;

    margin:
        0 auto
        1.5rem;

    font-size: 1.05rem;
    line-height: 1.7;

    opacity: 0.9;
}

.status {
    margin:
        2rem 0;

    font-style: italic;
    opacity: 0.7;
}

.button {
    display: inline-block;

    padding:
        0.8rem
        1.25rem;

    border: 1px solid currentColor;
    border-radius: 999px;

    color: inherit;

    text-decoration: none;
}

.button:hover,
.button:focus {
    background:
        rgba(
            255,
            255,
            255,
            0.08
        );
}