body {
    margin:0;
    background:#000;
    display:flex;
    align-items:center;
    justify-content:center;
    height:100vh;
    overflow:hidden;
}

.terminal {
    color:#ffffff;
    font-family: 'Montserrat', sans-serif;
    font-size:clamp(24px, 8vw, 56px);
    font-weight:800;
    letter-spacing:-1px;
    transition: opacity .5s ease;
    white-space:nowrap;
    font-style: italic;
}

.terminal.italic {
    font-style: italic;
}

/* 커서 */
.cursor {
    display:inline-block;
    width:8px;
    height:1em;
    background:white;
    margin-left:6px;
    animation: blink 1s infinite;
    vertical-align: -0.12em;
}

@keyframes blink {
    0%,50%,100% { opacity:1; }
    25%,75% { opacity:0; }
}

/* 글리치 */
.glitch {
    animation: glitch 220ms steps(2);
    text-shadow:
            7px 0 red,
            -7px 0 cyan;
}

@keyframes glitch {
    0% { transform: translate(0,0); }
    20% { transform: translate(-14px,7px); }
    40% { transform: translate(14px,-7px); }
    60% { transform: translate(-6px,3px); }
    80% { transform: translate(6px,-3px); }
    100% { transform: translate(0,0); text-shadow:none; }
}

/* 로고 */
.logo-wrap {
    position:absolute;
    left:50%;
    top:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    opacity:0;
    transform: translate(-50%, -50%) scale(0.9);
    transition: opacity .3s ease, transform .3s ease;
}

.logo-wrap.show {
    opacity:1;
    transform: translate(-50%, -50%) scale(1);
}

.logo-link {
    display:inline-block;
    line-height:0;
}

.logo-link:hover {
    opacity:0.9;
}

.logo {
    display:block;
    width:clamp(220px, 60vw, 420px);
    height:auto;
}
